您的位置：首页 > Web前端 > JavaScript

ArcGIS JavaScript API 实现基本的地图功能

2014-11-13 17:04 267 查看
代码如下：
<!DOCTYPE html>
<html>
<head>
<title>创建一幅地图</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
<link rel="stylesheet" href="http://127.0.0.1:8080/jsapi/3.11/dijit/themes/soria/soria.css">
<link rel="stylesheet" href="http://127.0.0.1:8080/jsapi/3.11/esri/css/esri.css">
<style>
html, body, #mapDiv{
padding: 0;
margin: 0;
height: 100%;
}
</style>
<script src="http://127.0.0.1:8080/jsapi/3.11/init.js"></script>
<script type="application/javascript" src="jsapi_vsdoc10_v38.js"></script>
<script>
var map,lods,fullExtent,tiledMapServiceLayer;
require(["esri/map", "esri/geometry/Extent", "esri/layers/ArcGISTiledMapServiceLayer", "dojo/domReady!"], function(Map, Extent, ArcGISTiledMapServiceLayer) {
lods = [
{"level": 0, "resolution": 0.028553532069963364, "scale": 12000000},
{"level": 1, "resolution": 0.01903568804664224, "scale": 8000000},
{"level": 2, "resolution": 0.00951784402332112, "scale": 4000000},
{"level": 3, "resolution": 0.00475892201166056, "scale": 2000000},
{"level": 4, "resolution": 0.00237946100583028, "scale": 1000000},
{"level": 5, "resolution": 0.00118973050291514, "scale": 500000},
{"level": 6, "resolution": 5.9486525145757E-4, "scale": 250000},
{"level": 7, "resolution": 2.3794610058302802E-4, "scale": 100000},
{"level": 8, "resolution":  1.1897305029151401E-4, "scale": 50000},
{"level": 9, "resolution": 5.9486525145757005E-5, "scale": 25000},
{"level": 10, "resolution": 2.3794610058302804E-5, "scale": 10000},
{"level": 11, "resolution": 1.1897305029151402E-5, "scale": 5000},
{"level": 12, "resolution": 4.75892201166056E-6, "scale": 2000}
];
fullExtent = new Extent({
"xmin": 73.441277, "ymin": 34.334934, "xmax": 96.388373, "ymax": 49.178574,
"spatialReference": {"wkid": 4326}
});
map = new Map("mapDiv", {
extent: fullExtent,
lods: lods,
slider:true,
sliderStyle:"large",
//sliderPosition:"top-left",
zoom: 0,
logo:false
});
tiledMapServiceLayer = new ArcGISTiledMapServiceLayer("http://10.238.208.34/arcgis/rest/services/BaseMap/XjOnline/MapServer");
map.addLayer(tiledMapServiceLayer);
});
</script>
</head>
<body class="soria">
<div id="mapDiv"></div>
</body>
</html>
输出结果：


说明：可以为map对象设置<String[]> sliderLabels属性显示滑动条文字说明。

本文出自 “IT技术学习与交流” 博客，谢绝转载！
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航