echarts百度地图控制显示区域

想要只显示某一区域的内容，超出的就禁止拖拽，但是测试了一天，也没有成功，而且如果真的禁止成功了，那往回拖拽的时候怎么开启也是一个问题，在网上参考了很多博客，想到了一个折中的解决方案，如果拖拽超出了指定的区域，就让它回到中心点位置，本想让它改变中心点为拖拽之后区域的中心点，但是那样依旧阻止不了一直拖拽出控制区域，所以改成超出便回到中心点

let bmap = myChart.getModel().getComponent('bmap').getBMap()
        bmap.setMinZoom(12)
        bmap.setMaxZoom(19)
        // bmap.addControl(new BMap.MapTypeControl())
        bmap.addEventListener('click', function (e) {
          console.log(e.point.lng)
          console.log(e.point.lat)
        })

        let extent = new Object()
        extent.minX = '118.842387'
        extent.maxX = '119.600126'
        extent.minY = '36.501958'
        extent.maxY = '36.933808'
        bmap.addEventListener('dragging', (type, target) => {
          console.log(bmap.getBounds())
          if (bmap.getBounds().Ol.lng < extent.minX || bmap.getBounds().xl.lng > extent.maxX || bmap.getBounds().Ol.lat < extent.minY || bmap.getBounds().xl.lat > extent.maxY) {
              bmap.centerAndZoom(new this.BMap.Point(119.222119, 36.717958), bmap.getZoom())
            console.log(bmap.getCenter())
          }
        })

new this.BMap在文档就绪函数内将调用成功的百度地图BMap赋值给data里的BMap

 this.$nextTick(() => {
        let _this = this
        MP(AK).then(BMap => {
          this.BMap = BMap
          this.height = window.screen.availHeight * 0.9 + 'px'
          this.$nextTick(() => {
            this.drawLine()
          })
          window.addEventListener('resize', () => {
            this.height = window.screen.availHeight * 0.9 + 'px'
            console.log(window.screen.availHeight)
            this.$echarts.init(document.getElementById('myChart')).resize()
          })
        })
      })