Echarts修改配置项

最新推荐文章于 2024-09-17 07:23:55 发布

耿彦丰

最新推荐文章于 2024-09-17 07:23:55 发布

阅读量2.2k

点赞数

文章标签： javascript

本文链接：https://blog.csdn.net/weixin_29344615/article/details/116198713

版权

本文讨论了在使用Echarts时，直接通过getOption修改配置可能导致的问题，推荐使用setOption直接更新特定部分配置的方法，以避免影响默认值和保持实例状态的一致性。同时强调了正确修改Echarts图表选项的重要性。

摘要由CSDN通过智能技术生成

不推荐下面这种写法：

var option = myChart.getOption();
option.visualMap[0].inRange.color = ...;
myChart.setOption(option);

getOption()获取当前实例中维护的 option 对象，返回的 option 对象中包含了用户多次 setOption 合并得到的配置项和数据，也记录了用户交互的状态，所以从这份 option 可以恢复或者得到一个新的一模一样的实例。

返回的 option 每个组件的属性值都统一是一个数组，不管 setOption 传进来的时候是单个组件的对象还是多个组件的数组。如下形式：

{
    title: [{...}],
    legend: [{...}],
    grid: [{...}]
}

因为 getOption 获取的是已经合并过默认值了的，所以在修改了某些配置项后会导致原本是根据这些配置项值去设置的默认值失效。

因此更推荐通过setOption去修改部分配置。

myChart.setOption({
    visualMap: {
        inRange: {
            color: ...
        }
    }
})

关注