本篇主要介绍利用arcgis api for javascript最新版本3.23加载谷歌地图和谷歌影像,以加载谷歌地图为例,方法即通过tiledmapservicelayer来自定义谷歌地图图层模块。
【谷歌地图】
【谷歌影像】
define(["dojo/_base/declare", "esri/layers/tiledmapservicelayer", "esri/geometry/extent", "esri/spatialreference", "esri/layers/tileinfo"], function (declare, tiledmapservicelayer, extent, spatialreference, tileinfo) { return declare(tiledmapservicelayer, { // 构造函数 constructor: function (properties) { // 这里使用坐标系为投影坐标系wgs_1984_web_mercator(wkid: 102113) this.spatialreference = new spatialreference({ wkid:102113 }); // 图层提供的起始显示范围以及整个图层的地理范围 this.fullextent = new extent(-20037508.342787, -20037508.342787, 20037508.342787, 20037508.342787, this.spatialreference); this.initialextent = new extent(5916776.8, 1877209.3, 19242502.6, 7620381.8, this.spatialreference); // 图层提供的切片信息 this.tileinfo = new tileinfo({ "rows": 256, "cols": 256, "compressionquality": 0, "origin": { "x": -20037508.342787, "y": 20037508.342787 }, "spatialreference": { "wkid": 102113 }, "lods": [ { "level": 0, "resolution": 156543.033928, "scale": 591657527.591555 }, { "level": 1, "resolution": 78271.5169639999, "scale": 295828763.795777 }, { "level": 2, "resolution": 39135.7584820001, "scale": 147914381.897889 }, { "level": 3, "resolution": 19567.8792409999, "scale": 73957190.948944 }, { "level": 4, "resolution": 9783.93962049996, "scale": 36978595.474472 }, { "level": 5, "resolution": 4891.96981024998, "scale": 18489297.737236 }, { "level": 6, "resolution": 2445.98490512499, "scale": 9244648.868618 }, { "level": 7, "resolution": 1222.99245256249, "scale": 4622324.434309 }, { "level": 8, "resolution": 611.49622628138, "scale": 2311162.217155 }, { "level": 9, "resolution": 305.748113140558, "scale": 1155581.108577 }, { "level": 10, "resolution": 152.874056570411, "scale": 577790.554289 }, { "level": 11, "resolution": 76.4370282850732, "scale": 288895.277144 }, { "level": 12, "resolution": 38.2185141425366, "scale": 144447.638572 }, { "level": 13, "resolution": 19.1092570712683, "scale": 72223.819286 }, { "level": 14, "resolution": 9.55462853563415, "scale": 36111.909643 }, { "level": 15, "resolution": 4.77731426794937, "scale": 18055.954822 }, { "level": 16, "resolution": 2.38865713397468, "scale": 9027.977411 }, { "level": 17, "resolution": 1.19432856685505, "scale": 4513.988705 }, { "level": 18, "resolution": 0.597164283559817, "scale": 2256.994353 }, { "level": 19, "resolution": 0.298582141647617, "scale": 1128.497176 } ] }); // 设置图层的loaded属性,并触发onload事件 this.loaded = true; this.onload(this); }, gettileurl: function (level, row, col) { var zoom = level - 1; var offsetx = math.pow(2, zoom); var offsety = offsetx - 1; var numx = col - offsetx; var numy = (-row) + offsety; zoom = level + 1; var num = (col + row) % 8 + 1; var url = "https://mt" + (col % 4) + ".google.cn/vt/lyrs=m@226000000&hl=zh-cn&gl=cn&x=" + col + "&y=" + row + "&z=" + level + "&s=gali"; return url; } }); } )
<script> var map; require([ "esri/map", "src/googlemaplayer", "dojo/parser", "dojo/domready!"], function(map,googlemaplayer,parser) { parser.parse(); map = new map("map", { logo: false, center: [107.9, 34.7], zoom: 4 }); var googlelayer = new googlemaplayer(); map.addlayer(googlelayer); }); </script>
下载地址:arcgis api for javascript3.23加载谷歌地图
源码包括谷歌地图、影像图(加标注)自定义文件(src/*.js)和图层加载显示文件(.html),arcgis api for javascript使用的是当前最新版本【3.23】。
如对本文有疑问, 点击进行留言回复!!
MFC的静态库.lib、动态库.dll(包含引入库.lib)以及Unicode库示例
CTF 刷题记录(一) 白云新闻搜索(手动与自动化SQL注入)
javascript如何使用函数random来实现课堂随机点名方法详解
网友评论