zoukankan      html  css  js  c++  java
  • Echarts使用随笔(2)-Echarts中mapType and data

    本文出处:http://blog.csdn.net/chenxiaodan_danny/article/details/39081071 

    series : [

                   {
                       name: 'iphone3',
                       type: 'map',
                       mapType: '杭州市',
                       roam: true,
                       itemStyle:{
                           normal:{label:{show:true}},
                           emphasis:{label:{show:true}}
                       },
                       data:[
                           //{name: '杭州',value: Math.round(Math.random()*1000)},
                         //  {name: '卢湾区',value: Math.round(Math.random()*1000)},
                        
                       ]
                   }
               ]

    2.  mapType显示地图范围,为china,显示中国地图,为浙江,显示浙江地图板块,若‘china|浙江’地图显示会出错,‘浙江|杭州市’显示杭州地图板块,但识别不了区以下级别,'杭州市|西湖区'地图显示错误无法加载

     series : [
                   {
                       name: 'iphone3',
                       type: 'map',
                       mapType: '浙江',//mapType为浙江,可识别以下数据,若为,'china'   或   ‘china|浙江’,不可识别以下数据
                       roam: true,
                       itemStyle:{
                           normal:{label:{show:true}},
                           emphasis:{label:{show:true}}
                       },
                       data:[
                             //未加市,不可识别,加了市,可识别
                             
                           //{name: '杭州',value: Math.round(Math.random()*1000)},//未加市不可识别

    //{name: '温岭市',value: Math.round(Math.random()*1000)},//不可识别市级以下级别
                           {name: '杭州市',value: Math.round(Math.random()*1000)},
                          {name: '台州市',value: Math.round(Math.random()*1000)},
                        
                       ]
                   }
               ]


    3.不可识别,无区级及以下地图

     series : [
                   {
                       name: 'iphone3',
                       type: 'map',
                       mapType: '浙江|杭州市',//无实际
                       roam: true,
                       itemStyle:{
                           normal:{label:{show:true}},
                           emphasis:{label:{show:true}}
                       },
                       data:[
                          
                           {name: '西湖区',value: Math.round(Math.random()*1000)},
                          // {name: '杭州市',value: Math.round(Math.random()*1000)},
                          //{name: '台州市',value: Math.round(Math.random()*1000)},
                        
                       ]
                   }
               ]


    4.直辖市,上海(不能写成上海市,否则无效name),显示上海地图,可识别区级,同样,写成'china|上海'会出错

    series : [
                   {
                       name: 'iphone3',
                       type: 'map',
                       mapType: '上海',
                       roam: true,
                       itemStyle:{
                           normal:{label:{show:true}},
                           emphasis:{label:{show:true}}
                       },
                       data:[
                             //未加市,不可识别,加了市,可识别
                             
                           {name: '闵行区',value: Math.round(Math.random()*1000)},
                          // {name: '杭州市',value: Math.round(Math.random()*1000)},
                          //{name: '台州市',value: Math.round(Math.random()*1000)},
                        
                       ]
                   }
               ]

    5.直辖市,mapType 写到区级,显示区级地图

      series : [
                   {
                       name: 'iphone3',
                       type: 'map',
                       mapType: '上海|闵行区',//写到区级,显示区级地图
                       roam: true,
                       itemStyle:{
                           normal:{label:{show:true}},
                           emphasis:{label:{show:true}}
                       },
                       data:[
                             //未加市,不可识别,加了市,可识别
                             
                           {name: '闵行区',value: Math.round(Math.random()*1000)},
                          // {name: '杭州市',value: Math.round(Math.random()*1000)},
                          //{name: '台州市',value: Math.round(Math.random()*1000)},
                        
                       ]
                   }
               ]
            };


    小结:

    1.mapType:不要与china写一起,不要三个下一起,非直辖市自治区省市一起写

    mapType: 'china',"//加载中国地图,并显示34个省直辖市自治区

       mapType: 'china|上海|闵行区',"//加载出错,无法识别该name

       mapType: 'china|上海',//加载出了上海地图,但无法显示出上海各区

       mapType: '上海',//加载上海地图,并显示上海各区

                mapType: '上海市',//加了市,无法识别,若是省级下的市要加上市,否则无法识别

                mapType: '浙江|杭州市',//显示杭州地图,但没有显示杭州各区

      mapType: '杭州市',//无法识别该name,省下面的市需要表上省

    2.尝试下来得出

    a.mapType识别两个关键词

    b.地图识别两级,如直辖市,市、区(区下无法识别,地图画到区级别且无区以下地标显示),非直辖市(自治区未尝试),省、市(市下无法识别,地图画到市且无区及以下地标显示)

    c.china单独写

    d.直辖市,市、区一起写,非则省市一起写,该写市的写市,该写区的写区,该写县的写县,不该写的也都不要写

      

  • 相关阅读:
    docker技术快速实现前后端项目的集群化⑥基于haproxy创建pxc集群的负载均衡
    docker技术快速实现前后端项目的集群化⑤docker环境下搭建percona-mysql的pxc集群
    docker技术快速实现前后端项目的集群化④linux基础防火墙命令和docker的安装部署
    docker技术快速实现前后端项目的集群化③renren-fast前端nodejs环境在windows下的搭建
    docker技术快速实现前后端项目的集群化②renren-fast后端java环境在eclipse中windows环境的搭建
    docker技术快速实现前后端项目的集群化①java项目在windows下maven环境的搭建
    docker技术快速实现前后端项目的集群化概述
    基于centos的docker基础镜像制作有jdk1.8的java环境镜像
    docker容器的ubuntu系统中设置apt-get代理和apt-get源
    centos7环境下php网站通过webshell安全扫描工具对系统做检测
  • 原文地址:https://www.cnblogs.com/Tmc-Blog/p/4663904.html
Copyright © 2011-2022 走看看