最近使用echarts做关系图可视化,官方文档配置搜索不好用,费了老鼻子劲看配置
在这里吐吐槽,记录一下用到得配置
安装
1 | npm install echarts --save |
挖坑填坑
4.x版本地图 dispatchAction 使用 showTip tooltip无法显示
替换为低版本 3.8.0
已知bug,详情参考 issues
Tree自定义线条颜色&宽度
npm找到引用的tree模块修改
js则修改 updateNode 方法
参考博客:
1 | // 使用中data[i]添加参数 |
需求: 地图放大缩小时显示/隐藏 标注
监听onscroll无果,找到了API georoam事件,事件返回的zoom值不太准确
建议手动 getOption获取1
2
3
4
5
6
7
8
9
10
11
12
13
14// zoom
let zoom = myChart.getOption().geo[0].zoom
// 滚动
myChart.on('georoam', params => {})
// 控制标注显示
myChart.setOption({
series: [{
label: {
normal: {
show: zoom > 2
}
}
}]
})
tooltip无法显示
经历了N分钟的配置项文档遨游以后,找到原因: 挂载dom不能为canvas
图表缓存?数据未清空
手动清空数据不如试试 myEchart.clear()
图表大小问题
更改挂载节点的宽高,然后 myEchart.resize()
自定义各种样式
大兄弟,formatter了解一下
事件
1 | let myChart2 = this.$echarts.init(document.getElementById('test2')) |