echarts tooltip 中 data-param
时间: 2024-12-10 07:36:45 浏览: 22
在ECharts图表组件中,`tooltip`(提示框)的`data-param`属性是一个自定义配置项,它允许开发者为每个数据点添加额外的数据信息。当你希望在提示框显示除原始数据系列值之外的一些定制内容时,可以设置这个参数。例如,你可以将数据系列的一个字段映射到提示框的某个部分,或者包含一些计算后的结果。
`data-param`通常是作为数组与`formatter`函数一起使用的,数组里的每个元素对应一条数据,而对应的`formatter`则用于解析和格式化`data-param`中的数据,将其转换为用户友好的文本形式。
```javascript
option = {
tooltip: {
formatter: function (params) {
// params是一个对象数组,每个元素包含数据值和data-param中的值
let paramValue = params[0].data.param; // 访问第一个数据点的data-param
return `${params[0].name}: ${params[0].value} - Custom Info: ${paramValue}`;
},
dataParams: [
{ name: 'Series1', value: 100, param: 'Custom Data 1' }, // 数据点1的参数
{ name: 'Series2', value: 200, param: 'Custom Data 2' } // 数据点2的参数
]
}
};
```
阅读全文