DorisOu opened a new issue #9371: 自定义系列的 polygon 绘制,点击下钻和对应的散点图
URL: https://github.com/apache/incubator-echarts/issues/9371
 
 
   使用百度api地图作为底图,拿到中山市的行政区域坐标后自定义系列的 polygon 绘制,加上每个镇的散点。点击每个镇下钻和对应的散点图,遇到问题:
   1、下钻到镇的地图我用geo注册使用,但是散点加载的是全部的散点,无法只加载该镇的
   2、双击无法返回上一级地图,dblclick事件里我实在不知道用echart的哪个方法。
   代码如下:
   //各镇的地图json文件
       var towns = {
           '东凤镇': 'childMaps/dongfeng.geo.json',
           '南头镇': 'childMaps/nantou.geo.json'
       };
   
       //各镇的数据
       var allData = [{
           name: '东凤镇'
       }, {
           name: '南头镇'
       }];
   
       var timeFn = null;
   
       //单击切换到子级地图,当mapCode有值,说明可以切换到下级地图
       scatterMap.on('click', function(params) {
           clearTimeout(timeFn);
           //由于单击事件和双击事件冲突,故单击的响应事件延迟250毫秒执行
           timeFn = setTimeout(function() {
               var name = params.name; //地区name
               var mapCode = towns[name]; //地区的json数据
               if (!mapCode) {
                   alert('无此区域地图显示');
                   return;
               }
               loadMap(mapCode, name);
           }, 250);
       });
   
       // 绑定双击事件,返回上级地图
       scatterMap.on('dblclick', function(params) {
           clearTimeout(timeFn);
           //返回上级地图
           scatterMap.clear();  
           scatterMap.setOption({},true);
       });
   
       //获取对应的json地图数据,然后向echarts注册该区域的地图,最后加载地图信息
       function loadMap(mapCode, name) {
           $.get(mapCode, function(data) {
               if (data) {
                   echarts.registerMap(name, data);
                   var option2 = {
                       geo: {
                           type: 'map',
                           map: name
                       },
                       series: [{
                               name: '小区人口分布',
                               type: 'map',
                               mapType: name,
                               selectedMode: 'false', //是否允许选中多个区域
                               label: {
                                   normal: {
                                       show: true
                                   },
                                   emphasis: {
                                       show: true
                                   },
                                   fontSize: 14
                               },
                               data: allData,
                               zlevel: 4,
                               tooltip: {
                                   show: false
                               },
                               itemStyle: {
                                   areaColor: "lightskyblue"
                               },
                               emphasis: {
                                   itemStyle: {
                                       areaColor: "lightskyblue"
                                   }
                               }
                           },
                           {
                               name: '小区人口分布',
                               type: 'scatter',
                               coordinateSystem: 'geo',
                               data: communitysData(communitys),
                               symbolSize: 10,
                               itemStyle: {
                                   normal: {
                                       color: '#000'
                                   }
                               },
                               tooltip: {
                                   formatter: function(params) {
                                       return params.name + ':' + 
params.value[2] + '人';
                                   }
                               },
                               zlevel: 5
                           }
                       ]
                   };
                   scatterMap.setOption(option2);
               } else {
                   alert('无法加载该地图');
               }
           });
       }
   
   1、如果可以用polygon再次绘制下钻的地图,怎么实现?
   2、用geo绘制下钻地图,如何只获取散点和返回上一级?

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
[email protected]


With regards,
Apache Git Services

---------------------------------------------------------------------
To unsubscribe, e-mail: [email protected]
For additional commands, e-mail: [email protected]

Reply via email to