示例描述

该示例展示自定义等级符号样式,包括符号大小markerSize、符号颜色markerColor、符号透明度markerAlpha,以及背景地图颜色mapFillColor。

效果演示

示例代码

<html>
 <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <script src='http://dev.dituhui.com/sdk/1.0.0/js/dituhui-flash.js'></script>
  <script src='http://dev.dituhui.com/sdk/1.0.0/js/sample-data.js'></script>
  <script type="text/javascript">
   var map = null;
   function init(){
    map = new Dituhui.Map("myMap", "http://dev.dituhui.com/sdk/1.0.0/swfs/", "100000", Dituhui.MapType.BUBBLE, "setData", "onError");
   }
   /*将数据分为4组,为每一组符号分别赋予不同的颜色和大小*/
   function setData(){
    var mapStyles = [
     {min:0,max:4,markerColor:'#66C2A5',markerSize:15},
     {min:4,max:8,markerColor:'#FC8D62',markerSize:20},
     {min:8,max:12,markerColor:'#8DA0CB',markerSize:25},
     {min:12,max:16,markerColor:'#E78AC3',markerSize:30}];
    var option = 
    {
     data: data, 
     styles:mapStyles, 
     valueField:'gdprate',
     /*定义等级符号地图的背景底图颜色*/
     mapFillColor:'#ffff00',
     backgroundColor:"#F5F5F5",
     legendTitle:"GDP增速%"
    };
    map.setMapOptions(option);
   }
   function onError(errorcode)
   {
    /*errorcode:错误编码,有关错误编码的详细描述可参考:
    "开发指南"-->"API参考"-->"错误编码"*/
    alert(errorcode);          
   }
   window.onload = init;
  </script>
 </head>
 <body>
     <div id='myMap' style='width:660px;height:600px'>
     </div>
 </body>
</html>