echarts地图内填充的数据如何正确绑定到formatter上并显示?
时间: 2024-05-08 11:15:52 浏览: 129
echarts 地图数据
在 ECharts 中,可以通过 formatter 属性来自定义地图数据的展示方式。具体步骤如下:
1. 在 ECharts 中设置地图数据的类型为 map。
2. 通过 data 属性传入地图数据,其中每个数据项都需要包括 name 和 value 两个属性。
3. 在 tooltip 属性中设置 formatter 属性,并通过回调函数将地图数据中的 value 值绑定到 tooltip 中。
示例代码如下:
```
option = {
tooltip: {
formatter: function(params) {
return params.name + ': ' + params.value;
}
},
series: [{
type: 'map',
data: [
{name: '北京', value: 100},
{name: '上海', value: 200},
{name: '广州', value: 300},
{name: '深圳', value: 400},
{name: '杭州', value: 500}
]
}]
};
```
在上述示例中,我们通过 formatter 回调函数将地图数据中的 value 值绑定到 tooltip 中,并设置了 tooltip 的展示方式为“城市名:数值”的形式。当鼠标移动到地图上的相应数据区域时,会自动触发 tooltip 显示该区域对应的数据信息。
阅读全文