ec-canvas 在对应的颜色上,显示他的name 和 他的 value,默认显示
时间: 2024-02-12 08:02:31 浏览: 100
要在ec-canvas生成的图上在对应的颜色上显示它的name和value,可以通过echarts的option配置项中的tooltip属性来设置。具体实现方式如下:
1. 在option中添加tooltip属性,设置触发类型为'axis',并且设置formatter函数来显示数据名称和数据值。例如:
```
option = {
...
tooltip: {
trigger: 'axis',
formatter: function(params) {
let name = params[0].name;
let value = params[0].value;
let dataName = params[0].seriesName;
return dataName + '<br>' + name + ': ' + value;
}
},
...
}
```
2. 在ec-canvas标签中添加canvas-id属性,并设置一个唯一的值,例如:
```
<ec-canvas id="mychart" canvas-id="mychart-canvas"></ec-canvas>
```
3. 在js代码中获取到ec-canvas的实例对象,然后调用setOption方法来设置option,例如:
```
const chart = this.selectComponent('#mychart').getEchartsInstance();
chart.setOption(option);
```
这样就可以在生成的图上在对应的颜色上显示它的name和value了,当鼠标悬停在对应的颜色上时,会显示数据名称和数据值。可以根据需要调整formatter函数中的显示格式。
阅读全文