<<博客迁移,原文是我51cto博客http://11095961.blog.51cto.com/11085961/1951206>>
做项目用到echarts2.2.7版本做树图,遇到点击树图节点“更改样式”(并不能更改样式,只能换图标/图片),百度、谷歌搜索后均没找到解决方案。后来苦苦探索,终于找到解决入口,特地分享给大家以供参考,吐槽一下echarts的api真的没有highcharts人性化和易找。
先说明关键点:
//贴出关键点!这是注册的事件(click/hover等)的处理函数
function clickFun(param) {
console.log(param);
param.data.symbol = 'image://http://www.viastreaming.com/images/apple_logo2.png';
//远程加载图片最好先预加载过来,避免下载图标延。 /**var oImg = new Image();oImg.src = img;**/
console.log(param.data.cusField);
chart.refresh(); //一定要refresh,否则不起作用
}
效果图完整源码:https://github.com/hzhqk/echarts.git 下 dynamic echarts tree/change node symbol/
网友评论
事件绑定,事件命名统一挂载到require('echarts/config').EVENT(非模块化为echarts.config.EVENT)命名空间下,建议使用此命名空间作为事件名引用,当前版本支持事件有:
-----------------------基础事件-----------------------
REFRESH(刷新),
RESTORE(还原),
RESIZE(显示空间变化),
CLICK(点击),
DBLCLICK(双击),
HOVER(悬浮),
MOUSEOUT(鼠标离开数据图形),
---------------------交互逻辑事件--------------------
DATA_CHANGED(数据修改,如拖拽重计算),
DATA_VIEW_CHANGED(数据视图修改),
MAGIC_TYPE_CHANGED(动态类型切换),
TIMELINE_CHANGED(时间轴变化),
DATA_ZOOM(数据区域缩放),
DATA_RANGE(值域漫游),
DATA_RANGE_SELECTED(值域开关选择),
DATA_RANGE_HOVERLINK(值域漫游hover),
LEGEND_SELECTED(图例开关选择),
LEGEND_HOVERLINK(图例hover),
MAP_ROAM(地图漫游),
MAP_SELECTED(地图选择),
PIE_SELECTED(饼图选择),
FORCE_LAYOUT_END(力导向布局结束)