javascript - Echarts - 自定义工具箱功能标记/评论

Question

我正在尝试在 echarts 3.8.5 中创建自定义工具箱功能，以便用户可以在图表中添加标记或评论。我没有找到任何具有自定义功能的演示，并且缺少扩展 API 的文档。

我的问题：

1. 如何在用户单击自定义功能时将其设置为“活动”（例如，当您在预定义功能中选择画笔时）
2. 如何在图表中获取用户点击的坐标
3. 如何将自定义元素添加到图表

Answer 1

1. 如何在用户单击自定义功能时将其设置为“活动”（例如，当您在预定义功能中选择画笔时）

   • 您可以调度一个动作，
   • 或者您可以手动更改图表对象并覆盖/替换现有的图表对象。您可以使用chart.setOption()插入一个全新的图表对象**

2. 如何在图表中获取用户点击的坐标

   • 使用鼠标事件来捕捉点击、悬停等。

3. 如何将自定义元素添加到图表

   • 要向选项添加某些内容（轴、系列、..），您可以使用chart.setOption()。
   • 对于切换设置或触发数据缩放等操作，您可以调度一个操作。

---

** 当您有自定义工具箱功能时（注意：它必须始终以my开头）：

toolbox: {
    feature: {
        myFeature: {
            show: true,
            title: 'My custom feature',
            icon: 'image:path/to/image-inactive.png'
            onclick: function (){
                // do something
            }
        }
    }
},

您可以使用以下方法手动将图标更新为活动状态：

chart.setOption({
    toolbox: {
        feature: {
            myFeature: {
                icon: 'image:path/to/image-active.png'
            }
        }
    }
})

Echarts 会检测到变化，并更新图标。当然，您可以使用相同的逻辑将其设置回非活动状态。