"最全中文API：ArcGis-for-JavaScript示例讲解及应用指南"

版权申诉

5星 · 超过95%的资源 36 浏览量更新于2024-03-01 5 收藏 341KB DOCX 举报

ArcGis-for-javaScript最全中文API提供了一系列示例展示了如何使用 ArcGIS JavaScript API 的各种功能。每个示例页包含一个在线的演示，描述了示例所展示的功能以及相应的源代码。通过查看视频，用户可以学习如何拷贝示例代码并在自己的机器上运行。这些示例按照复杂度分为一颗星、两颗星或三颗星，供用户根据自己的理解和技能水平选择合适的示例进行学习。对于初学者来说，建议从一颗星示例开始学习，以更好地理解基本的 API 使用方法。在掌握了基础知识之后，用户可以通过扩展或合并示例来创建适合自己应用的起始点。通过观看视频教程，用户可以学习如何创建自己的应用起始点，进一步探索 API 的各种功能。这些示例使用的服务来自 ESRI 示例服务器(sampleserver1 和 sampleserver2)以及 ArcGIS Online。用户可以在自己的测试应用中使用来自 ESRI 示例服务器的服务，从而更好地学习 API 的使用方法。此外，用户还可以在自己的应用中使用 ArcGIS Online 提供的图层。关于使用条款，请参考 ArcGIS Online 的首页获取更多信息。其中地图相关的示例主要展示了如何加入一个地图到应用中。通过这些示例，用户可以了解如何显示 ArcGIS Server 的地图，其中这些地图是缓存的，提供了一组预先渲染的切片以提升性能。用户可以通过这些示例学习如何使用 ArcGISTiledMapServiceLayer 类来加载和显示地图数据，进一步深入理解地图数据的渲染和显示方式。总的来说，ArcGis-for-javaScript最全中文API提供了丰富多样的示例，帮助用户快速上手并深入学习 ArcGIS JavaScript API 的使用方法。通过学习这些示例，用户可以掌握 API 的各种功能，并将其应用到自己的项目中，实现更加丰富和强大的地图应用程序。

dojo.require("esri.map");

function init() {

// In this sample i am pulling out levels 9 through 15 of the ESRI_Imagery_World_2D

// map service. Once the map has been created the level ids will be reset (0-8).

var lods = [ {"level" : 8, "resolution" : 0.001373291015625, "scale" : 577143.747208662},

{"level" : 9, "resolution" : 0.0006866455078125, "scale" : 288571.873604331},

{"level" : 10, "resolution" : 0.00034332275390625, "scale" : 144285.936802165},

{"level" : 11, "resolution" : 0.000171661376953125, "scale" : 72142.9684010827},

{"level" : 12, "resolution" : 8.58306884765629E-05, "scale" : 36071.4842005414},

{"level" : 13, "resolution" : 4.29153442382814E-05, "scale" : 18035.7421002707},

{"level" : 14, "resolution" : 2.14576721191407E-05, "scale" : 9017.87105013534},

{"level" : 15, "resolution" : 1.07288360595703E-05, "scale" : 4508.93552506767}];

var map = new esri.Map("map", {

extent: new esri.geometry.Extent({xmin:-116.61,ymin:33.57,xmax:-115.2,ymax:34.3,spatialReference:{wkid:4326}}),

lods: lods

});

dojo.connect(map, "onExtentChange", function(extent, delta, outLevelChange, outLod) {

dojo.byId("scale").innerHTML = "LOD Level: <i>" + outLod.level

+ "</i> Resolution: <i>" + outLod.resolution

+ "</i> Scale: <i>" + outLod.scale + "</i>";

});

map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/

ESRI_Imagery_World_2D/MapServer"));

map.addLayer(new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/Reference/

ESRI_BoundariesPlaces_World_2D/MapServer"));

}

dojo.addOnLoad(init);

</script>

</head>

</div>

</body>

</html>

2.11 设置自定义范围和空间参考

描述

这个示例展示了在创建地图时如果定义一个自定义的范围和空间参考。

在  的 '9 和 ' 版本，任何要使用的地图服务图层都需要和地图的空间参考一致。' 版本开始，可以使用和地图不同的空间参考的动态地图服务。虽然这提供了图层使

用上的更多的弹性，但是投影会影响性能。

地图中的缓存图层必须仍和地图的空间参考保持一致。

注意考范围通过空间参被指定为地图单位（在本例中，是米）。

代码

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<head>

<title>Dynamic Map Service Layer with Custom Projection and Extent</title>

tundra.css">

dojo.require("esri.map");

function init() {

var customExtentAndSR = new esri.geometry.Extent(-20037506,-9823074,20037506,10214431,new esri.SpatialReference({"wkid":54052}));

//create map with new custom spatial reference and extent. The map will be in the Goode Homolosine Land projection

var map = new esri.Map("map", {extent:customExtentAndSR});

//map service layer has a default spatial reference of 4326.

var mapServiceLayer = new esri.layers.ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/

Demographics/ESRI_Population_World/MapServer");

map.addLayer(mapServiceLayer);

}

dojo.addOnLoad(init);

</script>

</head>

<body>

<div id="map" class="tundra" style="position:relative; width:1024px; height:512px; border:2px solid #000;background-

color:#99CCFF;"></div>

</body>

</html>

2.12 显示地图属性

描述

本例展示了如哦读取地图和图层的属性和返回信息给用户。本例中的四个按钮允许用户接收地图属性。每个按钮调用不同的函数。

 Get All Map Layers=这个按钮调用 getMapLayers 函数，循环地图里的每个图层并在报警框中报告  ! ，8



和 "



信息

 Get SR=这个按钮调用 getSR 函数，在报警框中报告地图的空间参考的 )>!。

 Get Scales for portlandParcels=这个按钮调用函数 getScales，在地图服务图层的 " 切片中报告关于每个比例级别。该函数使用

 '/"



属性，这个属性能显示 $



里有多少个比例级别，级别是什么比例的，每个比例的分辨率是什么。

 Get Map Width Height=这个按钮调用函数 getMapWidthHeight，在报警框里报告地图的 .$



和 $$ ，单位是像素。

代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

<head>

<title>ArcGIS JavaScript API Map Layer</title>

tundra.css">

dojo.require("esri.map");

var myMap, portlandParcels, transportation, census;

function init() {

myMap = new esri.Map("mapDiv");

portlandParcels = new esri.layers.ArcGISTiledMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/

Portland/Portland_ESRI_LandBase_AGO/MapServer");

myMap.addLayer(portlandParcels);

transportation = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/Reference/

ESRI_Transportation_World_2D/MapServer", {"id":"agoreference", "opacity":0.5});

myMap.addLayer(transportation);

census = new esri.layers.ArcGISDynamicMapServiceLayer("http://sampleserver1.arcgisonline.com/ArcGIS/rest/services/Demographics/

ESRI_Census_USA/MapServer", {"id":"census","opacity":0.5});

myMap.addLayer(census);

}

function getMapLayers() {

for (var j=0, jl=myMap.layerIds.length; j<jl; j++) {

var currentLayer = myMap.getLayer(myMap.layerIds[j]);

alert("id: " + currentLayer.id + ", visible: " + currentLayer.visible + ", opacity: " + currentLayer.opacity);

}

function getSr() {

alert("Spatial Reference WKID: " + myMap.spatialReference.wkid);

}

function getScales() {

var tileInfo = portlandParcels.tileInfo;

var scales = "";

for (var j=0, jl=tileInfo.lods.length; j<jl; j++) {

var level = tileInfo.lods[j].level;

var scale = tileInfo.lods[j].scale;

var resolution = tileInfo.lods[j].resolution;

scales = scales + "level: " + level + ", scale: " + scale + ", resolution: " + resolution + "\n";

}

alert(scales);

}

function getMapWidthHeight() {

alert("Width = " + myMap.width + "; Height = " + myMap.height);

}

dojo.addOnLoad(init);

</script>

</head>

Simple example illustrating working with map and layer properties<br />

</body>

</html>

2.13 用第二个服务的范围设置地图范围

描述

本例展示了如何设置地图的范围为地图其中一个图层的范围。本例有两个图层： 上的世界地图图层  



和堪萨斯州的要素的图层

!  。本例展示了如何设置地图总是以堪萨斯州范围开始。

代码包含两个事件监听器，一个是为了每个图层。这些监听器帮助记录多少图层被加载。当图层计数是 ，createMapAddLayers 函数被调用。这个函数创建一个地图，设置地图范围是

 （堪萨斯州服务）的范围：

myMap = new esri.Map("mapDiv", { extent:myService2.fullExtent });

地图被创建以后，图层被增加。注意加载图层和增加图层不是一回事。在本例中，地图被创建前图层加载，地图创建以后图层被加到地图里。

直到所有图层被加载前要避免访问地图属性。如果代码中没有包含事件监听器，有可能在   完全加载前地图就会尝试去设置它的范围，这回引起意想不到的结果。

代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

剩余63页未读，继续阅读

普通网友

粉丝: 2w+

"最全中文API：ArcGis-for-JavaScript示例讲解及应用指南"

"ArcGIS-for-AutoCAD使用说明：入门、系统要求和安装步骤详解

ArcGIS for JavaScript API 中文教程详解

ArcGIS-API-for-Flex 教程：从入门到精通

ArcGis-for-javaScript最全中文API.pdf

arcgis-for-javascript最全中文api.pdf

ArcGis-javaScript最全的中文API.docx

ArcGis-for-javaScript最全中文API

gisweb ArcGis-for-javaScript最全中文API

ArcGis-for-javaScript API.zip_arcgis_arcgis api 中文_javascript

arcgis-js-api, 针对JavaScript的ArcGIS API版本.zip

最新资源