echarts 饼图encode
时间: 2023-11-02 07:03:52 浏览: 211
ECharts 中的饼图 encode 是一种数据映射方式,它可以将数据映射到饼图的颜色、大小、位置等属性上。使用 encode 可以轻松地实现多维度的数据展示和交互。
下面是一个简单的饼图 encode 示例:
```javascript
// 数据
var data = [
{value: 335, name: '直接访问'},
{value: 310, name: '邮件营销'},
{value: 234, name: '联盟广告'},
{value: 135, name: '视频广告'},
{value: 1548, name: '搜索引擎'}
];
// 配置项
var option = {
series: [
{
type: 'pie',
radius: '50%',
data: data,
encode: {
itemName: 'name', // 数据项名称映射
value: 'value', // 数据项值映射
tooltip: 'value', // 鼠标悬浮提示信息映射
label: 'name' // 饼图上标签文本映射
}
}
]
};
// 渲染图表
var chart = echarts.init(document.getElementById('chart'));
chart.setOption(option);
```
在 encode 中,itemName 表示数据项名称的映射,value 表示数据项值的映射,tooltip 表示鼠标悬浮提示信息的映射,label 表示饼图上标签文本的映射。你可以根据需要自由组合这些映射,实现多维度的数据展示。
阅读全文