echarts-bridge
echarts imperative programming bridge in MV* frontend framework.
Break Changes
调整入口配置,默认为commonjs
风格。
目标
前端MV*
框架,共同点都是不提倡直接进行底层DOM
操作,只能通过框架提供接口(如angularjs
指令),访问原始元素,但是对待图表这种重DOM
操作,使用数据同步的方式
进行,效率个人持保留意见。
echarts-bridge
目标是作为MV*
框架与echarts
之间的中间层,存在连接
,未连接
状态:
连接
状态,实例本身可以看做echarts instance
,可以直接参照官方文档操作未连接
状态,实例可以调用echarts instance
setter方法,但不会立即执行,而是实例内部缓冲,待与实际DOM
连接后进行操作
API
; /** * @description - echarts bridge instance * * @param * @param * @param */let instance = Reflect;let elem = docment; instance;
实例使用monkey patch
方式,缓冲开发操作。以下方法,除特别指明,皆可进行链式操作
。
Bridge#connect
: 数据对象与DOM
元素连接Bridge#disconnect
: 断开连接,销毁已生成实例(不支持链式调用,实例已销毁)。Bridge#resize
: 目前缓冲DOM
尺寸设定存在问题,连接后一切正常。 http://echarts.baidu.com/api.html#echartsInstance.resizeBridge#setOption
: http://echarts.baidu.com/api.html#echartsInstance.setOptionBridge#on
: http://echarts.baidu.com/api.html#echartsInstance.onBridge#off
: http://echarts.baidu.com/api.html#echartsInstance.offBridge#showLoading
: http://echarts.baidu.com/api.html#echartsInstance.showLoadingBridge#hideLoading
: http://echarts.baidu.com/api.html#echartsInstance.hideLoading
关联项目
目前关联项目为基于angularjs
的封装: echarts-ng