酒店网站开发方案,手机商城下载app,旅游网站设计图片,php建设网站怎么用方法1#xff0c;geo中加多个地图图形#xff0c;叠加。缩放时 可能会不一致#xff0c;需要捕捉georoam事件#xff0c;使下层的geo随着上层的geo一起缩放拖曳 geo: [{zlevel: 3,//geo显示级别#xff0c;默认是0 【最顶层图形】map: BJ,//地图名roam: true,scaleLimit: …方法1geo中加多个地图图形叠加。缩放时 可能会不一致需要捕捉georoam事件使下层的geo随着上层的geo一起缩放拖曳 geo: [{zlevel: 3,//geo显示级别默认是0 【最顶层图形】map: BJ,//地图名roam: true,scaleLimit: {min: 1,max: 4},zoom: 1.2,label: {show: true,fontSize: 12,color: #000000},itemStyle: {borderColor: #fff,borderWidth: 1.5,// emphasis:},emphasis: {label: {fontSize: 12,color: #fff,fontWeight: bold},itemStyle: {areaColor: #008A8A,shadowColor: rgba(0,10,10,0.53),shadowBlur: 10,shadowOffsetY: 8,shadowOffsetX: 6,focus: none,label: {show: true,},borderWidth: 3,borderColor: #fff}},select: {label: {fontSize: 12,color: #fff,fontWeight: bold},itemStyle: {areaColor: #008A8A,shadowColor: rgba(0,10,10,0.53),shadowBlur: 10,shadowOffsetY: 8,shadowOffsetX: 6,focus: none,label: {show: true,},borderWidth: 3,borderColor: #fff}},selectedMode: single,},{zlevel: 2,//geo显示级别默认是0 【第二层图形】map: BJ,roam: true,scaleLimit: {min: 1,max: 4},zoom: 1.2,label:{show:false},itemStyle: {//此处border设置你想要显示的地图外边框样式可设置border颜色阴影等borderColor: #fff,borderWidth: 4,shadowColor: #008A8A,shadowOffsetY: 6,shadowOffsetX: 3,},emphasis: {disabled: true}},{zlevel: 1,//geo显示级别默认是0 【最底层层图形】map: BJ,roam: true,scaleLimit: {min: 1,max: 4},zoom: 1.2,label:{show:false},itemStyle: {//底层地图样式//此处border设置你想要显示的地图外边框样式可设置border颜色阴影等borderColor: #fff,borderWidth: 4,shadowColor: #AAD8D9,shadowOffsetY: 10,shadowOffsetX: 6,},emphasis: {disabled: true}}],series: [{name: xxx量,type: map,geoIndex: 0,data: this.dataList}] //捕捉georoam事件使下层的geo随着上层的geo一起缩放拖曳this.myChart.on(georoam, function (params) {var option _this.myChart.getOption();//获得option对象if (params.zoom ! null params.zoom ! undefined) { //捕捉到缩放时option.geo[1].zoom option.geo[0].zoom;//下层geo的缩放等级跟着上层的geo一起改变option.geo[1].center option.geo[0].center;//下层的geo的中心位置随着上层geo一起改变option.geo[2].zoom option.geo[0].zoom;option.geo[2].center option.geo[0].center;} else {//捕捉到拖曳时option.geo[1].center option.geo[0].center;//下层的geo的中心位置随着上层geo一起改变option.geo[2].center option.geo[0].center;}_this.myChart.setOption(option);//设置option});方法2直接加阴影。这样会在最上层显示出阴影的分界线效果不好 geo: {map: BJ,roam: true,scaleLimit: {min: 1,max: 4},zoom: 1.2,label: {show: true,fontSize: 11,color: #000000},itemStyle: {borderColor: #fff,borderWidth: 2,shadowColor: #008A8A,shadowOffsetY: 8,shadowOffsetX: 6,emphasis: {areaColor: #008A8A,shadowColor: rgba(0,10,10,0.53),shadowBlur: 10,shadowOffsetY: 8,shadowOffsetX: 6,focus: none,label: {show: true,},borderWidth: 3,borderColor: #fff}},emphasis: {label: {fontSize: 12,color: #fff,fontWeight: bold},},selectedMode: single,},series: [{name: xxx量,type: map,geoIndex: 0,data: this.dataList}]
