如何用echarts收听地图缩放？

Question

我正在使用带有 Angular 的 Echarts 来显示地图。

我希望地图是可缩放的（在图表选项中使用 roaming: true 完成），而且还希望在缩放足够强时加载不同的地图。

例如，如果缩放小于 150%，我想显示我的国家的地图，但如果缩放超过 150%，我想加载更精细的地图显示区域内的领土。

用 echarts 可以吗？

我尝试监听鼠标滚动事件，但没有成功：只有当我在 echarts 组件上滚动但不在地图上时才能访问该事件>。如果我在地图上滚动，则会执行缩放，但我没有收到任何鼠标滚动事件。

有没有人可以帮助我实现目标？谢谢！

Answer 1

您应该使用库提供的 dataZoom 事件来监听缩放事件。

'dataZoom': function(params,charts)
{
   x1Index = params['batch'][0]['startValue']; //start index of data array
   x2Index = params['batch'][0]['endValue']; //end index of data array

   var currentOption = charts.getOption();

   //change charts option (same sintax has the original option you used to create charts
   currentOption['title'] = 'New Title'; //for example

  charts.setOption(currentOption,false); //override the current option. If the second params is true, echarts will tries to merge options but it doesn't work perfectly
}