echarts formatter 里面能获取到this么
时间: 2023-08-22 16:05:22 浏览: 92
能的,当你在 formatter 中使用箭头函数时,this 指向的是 formatter 函数的外层作用域。如果你使用普通函数,则 this 指向的是 ECharts 实例。所以,如果你需要在 formatter 中访问 ECharts 实例或者组件的其他属性和方法,可以使用 this 来获取。但是需要注意的是,如果你使用了异步操作(如 AJAX 请求),this 可能会发生改变,因此建议在异步操作中使用箭头函数或者显式地将 this 绑定到正确的上下文中。
相关问题
echarts 自定义formatter
回答: 在echarts中,可以使用formatter属性来自定义数据的显示格式。引用[1]中提到了柱形图中的label属性,可以通过设置formatter来自定义柱子上显示的数据。例如,可以根据条件来判断是否显示数据,如果柱子的宽度小于36,则返回空字符串,否则返回数据的值。引用[2]中也提到了可以使用formatter属性来自定义返回的样式,可以接收一个字符串或者一个方法。可以使用ES6的箭头函数来使用全局变量this。引用[3]中举了一个例子,使用formatter来自定义tooltip中的样式。可以使用字符串模板来设置tooltip的样式,可以设置不同的颜色和形状来区分不同的数据。在formatter中可以通过params来获取数据的值,并根据需要进行处理和拼接,最后返回自定义的字符串内容。
echarts自定义legend. formatter
ECharts中的legend组件可以通过formatter属性进行自定义。formatter属性可以设置为字符串模板、函数模板或回调函数三种方式。
1. 字符串模板方式:
```javascript
legend: {
data: ['数据1', '数据2', '数据3'],
formatter: '{name} - {value}'
}
```
2. 函数模板方式:
```javascript
legend: {
data: ['数据1', '数据2', '数据3'],
formatter: function(name) {
return name + ' - ' + this.getData(name).value;
}
}
```
3. 回调函数方式:
```javascript
legend: {
data: ['数据1', '数据2', '数据3'],
formatter: function(name) {
// 自定义处理逻辑
return name + ' - ' + value;
}
}
```
其中,字符串模板方式和函数模板方式都可以通过{name}和{value}来获取图例名称和对应的值。回调函数方式则需要自己定义处理逻辑。
阅读全文