-
Notifications
You must be signed in to change notification settings - Fork 1.6k
2.x相比1.x的变化
主要变化有两个:
-
module
拆分更细,更利于按需引用 -
shape
和loadingEffect
才用类化风格进行了重新设计
在1.x中,ZRender
和Storage
实例的addShape
方法,接收的是一个Object
类型的shapeOption
,通过shapeOption.shape
标识形状的类型。zrender在加载时默认预置了几乎所有的形状。
zr.addShape({
shape : 'image',
scale : [1, 1],
zlevel : 1,
style : {
x : 0,
y : 0,
image : imageShape.style.image
},
draggable : false,
hoverable : false,
});
在2.x中,对Shape进行了按模块拆分,zrender在加载时不再预置。ZRender
和Storage
实例的addShape
方法,接收的是Shape
实例,所以,使用者需要自己创建相应的Shape实例,再传递给addShape
方法。创建Shape
实例的option
中不需要包含描述类型信息的option.shape
属性。
var ImageShape = require('zrender/shape/Image');
var imageShape = new ImageShape({
scale : [1, 1],
zlevel : 1,
style : {
x : 0,
y : 0,
image : imageShape.style.image
},
draggable : false,
hoverable : false
});
zr.addShape(imageShape);
Shape类化后,相应的方法做了删除shape实例传入,通过this引用来代替
的调整。相关调整的类方法有:brush
、updateTransform
、drift
、isCover
等。
这两个事件,把arguments中的shape
去掉了,可以通过this
获得当前shape。
__needTransform
属性变更为needTransform
在1.x中,tool/loadingEffect
作为独立存在的模块,提供所有加载效果的实现。ZRender
和Painter
实例的showLoading
方法接收的是一个Object
类型的loadingOption
,通过loadingOption.effect
标识加载效果的类型。
zr.showLoading({
effect : 'bar',
// ...
});
在2.x中,对tool/loadingEffect
进行了按模块拆分和类化。ZRender
和Painter
实例的showLoading
方法,接收的是Effect
实例。所以,使用者需要自己创建相应的Effect
实例,再传递给showLoading
方法。创建Shape
实例的option
中不需要包含描述标识加载效果的类型
的属性。
var BarEffect = require('zrender/loadingEffect/Bar');
var barEffect = new BarEffect({
// ...
});
// 做法1: 每次都传入effect对象
zr.showLoading(barEffect);
// 做法2: 一次传入effect对象,每次无餐调用showLoading
zr.painter.setLoadingEffect(barEffect);
zr.showLoading();
showLoading
方法的签名为showLoading({Object=}loadingEffect)
,loadingEffect是可选
参数。Painter
增加了setLoadingEffect
方法。使用者可以事先调用Painter
实例的setLoadingEffect
,然后每次只需要直接showLoading()
就行。ZRender
实例不包含setLoadingEffect
方法,使用者可以通过myZrender.painter.setLoadingEffect
来调用。
在1.x的loadingOption
中,effect
代表的是效果类型,effectOption
代表的是效果参数。
在1.x的loadingOption
中,由于不用传递效果类型,所以将代表效果参数的effectOption
更改成effect
。
将唯一id生成进行了统一,删除了zrender
和Storage
上的newShapeId
方法。使用者如果要生成唯一id,可以通过如下途径:
var guid = require('zrender/tool/guid');
guid();
原位于'tool/util'中computeBoundingBox
相关的方法,移动到'tool/computeBoundingBox'中。该模块是一个function,下面带有几个静态方法,用于特殊场景的BoundingBox计算:
- arc
- cubeBezier
- quadraticBezier
var computeBoundingBox = require('zrender/tool/computeBoundingBox');
computeBoundingBox(/*....*/);
computeBoundingBox.arc(/*....*/);
computeBoundingBox.cubeBezier(/*....*/);
computeBoundingBox.quadraticBezier(/*....*/);
- 将
Storage
、Painter
、Handler
抽离出来,成为独立模块 - 将
ZRender
类进行了prototype化
如下配置项从zrender
主模块移动到了config
模块中。
- catchBrushException
- debugMode
var config = require('zrender/config');
computeBoundingBox(/*....*/);
config.debugMode = 1;
原先log功能以方法的形式在zrender
主模块以zrender.log
的方式提供,现迁移到tool/log
。