echarts做企业关系图谱 添加提示框
时间: 2023-08-24 16:23:50 浏览: 42
要为ECharts企业关系图谱添加提示框,可以使用ECharts的tooltip组件。首先,你需要在ECharts的option中设置tooltip属性,如下所示:
```
option = {
tooltip: {
trigger: 'item',
triggerOn: 'mousemove'
},
...
}
```
在tooltip属性中,你需要指定tooltip的触发方式和触发时机。在上面的例子中,tooltip会在鼠标移动到图表数据项上时触发。
接下来,你需要在data属性中为每个节点添加tooltip的内容。可以在data中为每个节点添加tooltip属性,如下所示:
```
data: [{
name: '节点1',
tooltip: {
formatter: '这是节点1的提示框内容'
}
}, {
name: '节点2',
tooltip: {
formatter: '这是节点2的提示框内容'
}
}, {
name: '节点3',
tooltip: {
formatter: '这是节点3的提示框内容'
}
}]
```
在上面的例子中,每个节点都有一个tooltip属性,其中formatter属性指定了tooltip的内容。
最后,你需要在series属性中指定关系图的类型和数据。例如,如果你想要使用关系图中的节点和连线来显示企业关系,可以使用graph类型的series,如下所示:
```
series: [{
type: 'graph',
data: [{
name: '节点1',
tooltip: {
formatter: '这是节点1的提示框内容'
}
}, {
name: '节点2',
tooltip: {
formatter: '这是节点2的提示框内容'
}
}, {
name: '节点3',
tooltip: {
formatter: '这是节点3的提示框内容'
}
}],
links: [{
source: '节点1',
target: '节点2'
}, {
source: '节点2',
target: '节点3'
}]
}]
```
在上面的例子中,graph类型的series中的data属性指定了节点的数据,links属性指定了连线的数据。每个节点都有一个tooltip属性来指定提示框的内容。
希望这些可以帮助你为ECharts企业关系图谱添加提示框。
阅读全文