arcgis for js 从入门到放弃二:dojo初识和arcgis的多种写法

关于arcgis api 和dojo的关系,只需知道该js api是构建于dojo上,从而充分利用dojo来屏蔽各浏览器差异。
讲真,我对dojo了解也不多,这个框架又大又冷门。不过所幸,玩arcgis对dojo不需要懂太多,很多东西用原生的js或jquery就可以实现。
首先解释一下上一章内的代码:
require(["esri/map", "dojo/domReady!"], function(Map) {
      var map = new Map("map", {
        center: [-118, 34.5],
        zoom: 8,
        basemap: "topo"
      });
});
简单来说,require相当于java里的import,后面的"esri/map"相当于包名。"dojo/domReady!"其中“!”表示插件,这个代码表示等文档准备完成后执行。
arcgis for js包有几十上百M,不可能一次性全部引入进来。require相当于动态创建script标签,引入相应的js文件。你可以在esri文件下找到map.js文件。js文件一旦引入就自动执行,而Map相当于创建一个叫Map的变量接收js文件返回的一个对象。
新手还有一个困惑就是init.js里面修改的路径的作用。我查了arcgis很多资料都没有讲到这个,但是dojo里面有个baseUrl的概念,个人认为这个路径就是dojo.baseUrl。这个url指向的是存放dojo.js文件夹的路径,用于dojo的模块管理,dojo在require的时候就会根据这个路径去找相应的模块。
关于dojo还需要稍微了解一下define和declare,简单理解一个定义模块,一个定义类。可以参考这篇文章:
http://blog.csdn.net/eengel/article/details/13021687

对于新手们,可能还有这样一种困惑
dojo.require("esri.map");      
var myMap;
function init() {
    myMap = new esri.Map("map");
    var myTiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer(
        "http://cache1.arcgisonline.cn/arcgis/rest/services/ChinaOnlineCommunity/MapServer");
    myMap.addLayer(myTiledMapServiceLayer);
    myMap.setZoom(4);
   }
 dojo.addOnLoad(init);

这种代码和之前的看起来有点不一样,其实这只是老版本的写法,dojo新版本推荐采用amd模式。arcgis两种模式都可以,官网推荐是使用amd模式,但是地图代码划分为多个js文件而又没有采用dojo的模块管理的话,其实老版本写法更简单一些。但是在使用legacy模式时一定要注意引入的模块不要写错了,比如

这里写图片描述

这里写图片描述

而且比较坑的是,api里面也有错的,总之如果报错了就去本地的文件里面检查一下这个类真实的包路径。
另外还要说明的是dojo不会重复引入同一个js文件,如果在加载某些模块的时候还引入了其他所需要的类,比如定义类的时候引入父类,那之后即使再次进行require,也不会再引入一次。上面esri.layers.ArcGISTiledMapServiceLayer并没有对应的require,其实这个对象在init.js加载的过程中就被引入了,甚至将dojo.require("esri.map")去掉也能正常跑起来。我在学习的过程中第一次遇到这种情况时也是一脸懵逼。
在学习的过程中还经常看到class="tundra"以及其他dojo提供的皮肤样式,这里面的css对地图没啥影响,就是改一些button啥的样式。dojo有自己的一套布局系统和css,但是实际开发中用得很少,而且这些样式我都试过,全都不好看,初学者请无视之。
总之dojo框架是面向对象的,新手首先要理解这一点,切换到面向对象的思维去玩arcgis。关于js的面向对象可以参阅《javascript 高级程序设计》第6章的内容。因此arcgis只要掌握几个常用的对象就能玩起来。在下面几章里如果遇到dojo相关的概念我会再补充。
  • 7
    点赞
  • 14
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值