[JavaScript知识库]echarts 地图鼠标点击和滚动事件

1 开启鼠标点击和滚动

?设置roam为true

          geo: {
            map: 'china',
            roam: true, // 鼠标缩放和平移漫游
            // silent: true,
            zoom: 1.1,
            center: [105.32817322555658, 33.930049038112244],
            itemStyle: {
              normal: {
                borderColor: 'rgba(88,121,193,1)',
                borderWidth: 1,
                areaColor: 'rgba(72,111,197,.2)'
              },
              emphasis: {
                areaColor: '#F5A623'
              }
            },
            label: {
              normal: {
                show: true,
                color: '#fff'
              },
              emphasis: {
                show: false
              }
            }
          },

2 注册事件

  this.chinaChart = echarts.init(this.$refs.Map)

点击事件?

 this.chinaChart.on('click', (data) => {})

拖动事件?

      this.chinaChart.on('georoam', (params) => {
        // // 如果是拖拽事件，则返回
        if (params.dy || params.dx) return
        var _option = that.chinaChart.getOption()
        var _zoom = _option.geo[0].zoom
        console.log(_option.geo[0])
      })