ECharts 移动端 取消然后再选中会导致对应数据项focus
时间: 2023-06-19 22:05:12 浏览: 50
可以通过设置 ECharts 实例的 `restore` 属性为 `false` 来禁用图表的重置功能,这样就可以避免取消选中然后再次选中时会出现 focus 的问题。具体的代码如下:
```js
var myChart = echarts.init(document.getElementById('myChart'));
// 禁用重置功能
myChart.setOption({
restore: false,
// 其他配置项
// ...
});
```
设置了 `restore` 属性为 `false` 之后,如果需要重置图表,可以自行编写重置功能,并通过调用 ECharts 实例的 `clear` 和 `setOption` 方法来重置图表。例如:
```js
// 清空图表
myChart.clear();
// 重新设置数据和配置项
myChart.setOption({
// 数据和配置项
// ...
});
```
相关问题
ECharts 移动端 图例取消然后再选中会导致对应数据项focus
可以通过设置 `legend.selectedMode` 为 `false` 来取消图例的选中状态。如果想要在取消选中后不再触发对应数据项的 `focus`,可以通过监听 `legendselectchanged` 事件,在事件处理函数中手动取消对应数据项的 `focus`。具体实现可以参考下面的示例代码:
```javascript
// 取消图例选中状态
myChart.on('legendselectchanged', function(params) {
if (params.selected[seriesName]) {
myChart.dispatchAction({
type: 'legendUnSelect',
name: seriesName
});
// 手动取消对应数据项的 focus
myChart.dispatchAction({
type: 'downplay',
seriesIndex: 0,
dataIndex: dataIndex
});
}
});
// 监听数据项的点击事件,触发 focus
myChart.on('click', function(params) {
if (params.seriesName === seriesName) {
myChart.dispatchAction({
type: 'highlight',
seriesIndex: 0,
dataIndex: params.dataIndex
});
}
});
```
其中,`seriesName` 和 `dataIndex` 分别表示对应的系列名称和数据项索引。
ECharts 移动端 图例取消然后再选中会导致对应数据项focus,怎么让tooltip不会自动让数据项focus
可以通过配置 `tooltip.triggerOn` 属性来实现,将其设置为 `'none'` 可以禁止 tooltip 绑定默认的触发事件,从而避免 tooltip 会自动让数据项 focus。
示例代码如下:
```javascript
option = {
// ...
tooltip: {
trigger: 'axis',
triggerOn: 'none', // 禁止 tooltip 绑定默认的触发事件
// ...
},
// ...
};
```