快速入门

本节介绍如何在线快速使用地图慧SDK,创建地图应用。使用离线版,请联系我们

1)准备HTML页面,引用SDK中javascript库文件,代码如下;
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <!--引用dituhui_flash.js-->
        <script src='http://dev.dituhui.com/sdk/1.0.0/js/dituhui-flash.js'></script>
    </head>
    <body>
        <!--指定放置地图的容器,设定宽、高 -->
        <div id='myMap' style='width:680px;height:550px'>
        </div>
    </body>
</html>
2)编写JS代码初始化map
/*1、声明map变量*/
var map = null;
/*2、初始化地图,参数说明:
params1: 放置map的div的id
params2: 放置swf文件夹的路径
params3: 指定地图的行政区划代码
params4: 指定地图的模板(RANGE、BUBBLE...,枚举对应的值为:"Range"、"Bubble")
params5: 地图初始化成功的回调函数名称,必须在回调函数中设置地图参数和数据
params6: 错误回调函数,地图中的异常或错误都会回调这个函数
params7: 语言版本,目前支持"zh_cn"与"en_us"两种*/
function init(){
    map = new Dituhui.Map("myMap", "http://dev.dituhui.com/sdk/1.0.0/swfs/", "100000", Dituhui.MapType.RANGE, "setData", "onError", "zh_cn");
}

/*页面加载完后初始化地图*/
window.onload = init;
3)在回调函数中对map进行设置
/*1、在回调函数setData中配置地图*/
function setData(){
    /*地图分段样式设置:将需要制图的数据分成4组,给每一个组分别设置数值区间和显示样式,参数说明:
    min:该组的最小值
    max:改组的最大值*/
    var mapStyles = [
        {min:1,max:4,displayValue:'4%以下'},
        {min:4,max:8,displayValue:'4%~8%'},
        {min:8,max:12,displayValue:'8%~12%'},
        {min:12,max:16,displayValue:'12%以上'}];
    var titleStyle = {fontSize:25,fontColor:'#000000'};
    var subTitleStyle = {fontSize:15,fontColor:'#000000'};
    /*用户数据设置:只能接收以json对象的方式存储的数据,地区列名称为"name",
    可以指定标注文本的字段,例如"pyname"*/
    var data = [
        {name:'浙江',gdprate:'8.0'},
        {name:'广东',gdprate:'8.2'},
        {name:'江苏',gdprate:'10.1'},
        {name:'上海',gdprate:'7.5'},
        {name:'北京',gdprate:'7.7'},
        {name:'福建',gdprate:'11.4'},
        {name:'山东',gdprate:'9.8'},
        {name:'四川',gdprate:'12.6'},
        {name:'湖北',gdprate:'11.3'},
        {name:'湖南',gdprate:'11.3'},
        {name:'辽宁',gdprate:'9.5'},
        {name:'天津',gdprate:'13.8'},
        {name:'河南',gdprate:'10.1'},
        {name:'重庆',gdprate:'13.6'},
        {name:'山西',gdprate:'10.1'},
        {name:'云南',gdprate:'13.0'},
        {name