因为接下来要做的事是一个关系图的东西,所以自己先写一个小demo,特次记录一下,主要实现的点有如下:
节点的颜色的更改
自定义提示框配置,以及在里面的点击事件
提示框中的点击事件可以获取到vue实例
图列的自定义
先上效果图
截屏2020-11-18下午4.31.28.png
我们说关键吧:
颜色的配置,直接配置color ,它是一个数组,不同级别的的节点根据数组来
color:['red', 'orange', 'green', 'blue', 'purple'],
自定义提示框配置,以及在里面的点击事件
需要配置option.tooltip.formatter
formatter: function(params) {
// console.log(params , window , this)
var htmlStr = `
描述:
${params.data.name}
编码:
是否已汇报的状态描述
类型:
是否已汇报的状态描述
长度:
是否已汇报的状态描述
`
return htmlStr;
},
⚠️注意一下,这里一不小心就很容易报错:handleClick is not defined,因为这个方法是要找window上的,所以我们一定要确保window上有这个方法
提示框中的点击事件可以获取到vue实例
我都想好了,说不定在handleClick事件里面要获取到vue实例的对象呢,那怎么可以获取到vue实例呢?嘻嘻
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)