echarts 3D地圖

地圖選擇器獲取區域json數據（http://datav.aliyun.com/tools/atlas/#&lat=31.769817845138945&lng=104.29901249999999&zoom=4）

import fuyang from  '../assets/fuyang.json'

　　

zheJiang(){
      this.$echarts.registerMap("fuyang", fuyang);
      var img = new Image();
      // img.src = aa.aa
      img.width = '100%'
      img.height ='100%'
            // let imageDom = aa.aa
            let data = [
              [
                [119.5313, 29.8773],[120.498, 27.8119]
              ]
              
            ]
            var option = {
                backgroundColor: {
                  image:img
                },
                tooltip: {
                    trigger: 'item',
                    formatter: function(data){
                      console.log(data);
                    },
                },
                geo3D: {
                  viewControl: {
                    // rotateSensitivity: 0,
                    projection: 'orthographic',
                    // orthographicSize: 110, //控制地圖大小
                    // maxOrthographicSize: 110,
                    // minOrthographicSize: 110,
                    // autoRotate:false,
                    // animation:true,
                    alpha:60,
                    beta:10,
                    animationDurationUpdate:10
                  },
                  map: 'fuyang',
                  roam: false,
                 itemStyle: {
                          areaColor: '#65e',
                          shadowColor: '#65e',
                          // opacity: 0.2,
                          borderWidth: 0.8,
                          borderColor: '#65e'
                      },
                  label: {
                      show: true,
                      textStyle: {
                          color: '#f00', //地圖初始化區域字體顏色
                          fontSize: 16,
                          // opacity: 1,
                          backgroundColor: 'rgba(0,0,0,0)'
                      },
                  },
                  emphasis: { //當鼠標放上去  地區區域是否顯示名稱
                      itemStyle: {
                          areaColor: '#65e',
                          shadowColor: '#65e',
                          // opacity: 0.2,
                          borderWidth: 0.8,
                          borderColor: '#31e4ff'
                      },
                      label: {
                          show: true,
                          textStyle: {
                              color: '#fff',
                              fontSize: 16,
                              backgroundColor: 'rgba(0,23,11,0)'
                          }
                      }
                  },
                  shading: 'lambert',
                  light: { //光照陰影
                      main: {
                          color: '#65e', //光照顏色
                      // shadowColor: '#f00',
                          intensity: 1.2, //光照強度
                          //shadowQuality: 'high', //陰影亮度
                          shadow: true, //是否顯示陰影
                          alpha: 55,
                          beta: 10
                      },
                      ambient: {
                          intensity: 0.1
                      }
                  },
                  realisticMaterial:{
                      detailTexture:'./images/bg.jpg'
                  }
              },
              series: {
                 name: 'ss',
                    type: 'lines3D',
                    
                    coordinateSystem: 'geo3D',
                    data: data,
                    color: {
                        // image: imageDom, // 支持為 HTMLImageElement, HTMLCanvasElement，不支持路徑字符串
                        repeat: 'repeat' // 是否平鋪, 可以是 'repeat-x', 'repeat-y', 'no-repeat'
                    },
                    itemStyle: {
                      normal: {
                        areaColor: '#65e'
                      }
                    }
              }
            };

        
        this.myChart4 = this.$echarts.init(this.$refs.zhejiangMap);
        this.myChart4.setOption(option);
        this.myChart4.on('click', function(e){
          console.log(e);
        })
    }