双击echart标题时如何触发事件

Question

我试图让用户可以通过双击来更改 echarts 标题。我遇到的主要问题是触发事件。我在文档中注意到他们没有 Title 组件的实例，所以我想知道是否有可能触发该事件。这个例子展示了几种在图表上捕捉事件的方法，但没有一个包含图表标题。考虑到这个例子，我想要做的是：myChart.on(ecConfig.EVENT.DBLCLICK.TITLE , eConsole);关于触发此事件的任何建议？

Answer 1

是的，你可以。只要您引用了您的图表实例，您就可以获取在您的图表组件内发生的任何受支持的事件。

您必须title.triggerEvent通过将其设置为true（默认为false）来启用。这将允许标题触发事件。

然后在您的外部方法中，引用图表实例并使用.on(eventName, function(params)). 该params对象将包含componentType字符串，该字符串将告诉您目标组件的名称。您所要做的就是对其进行适当的检查！

复制/粘贴此代码以在官方在线编辑器上试用：

option = {

  title: {

    text: 'Click me',

    triggerEvent: true

  },

  xAxis: {

    type: 'category',

    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']

  },

  yAxis: {

    type: 'value'

  },

  series: [{

    data: [820, 932, 901, 934, 1290, 1330, 1320],

    type: 'line'

  }]

};

myChart.on('dblclick', params => {

  if (params.componentType === 'title') {

    console.log('title is double-clicked!')

  }

})

当您双击标题时，它会在控制台中记录此消息：

title is double-clicked!

由于有componentType支票，它只会在标题点击时触发。

要了解有关可能的事件类型和处理的更多信息，请查看文档中的本章。

Answer 2

我真的不确定这是否可能，因为这是一个非常奇怪的特定并且（至少对于开发人员）无用。最好的办法是检测周围 div 上的点击并返回该点击的位置。然后您将能够确定点击是否在正确的区域内，从而产生一个click on title事件。

希望这有帮助。