javascript
超图 for javascript 版本入门程序讲解
啟動iServer服務以后，進入到服務管理頁面；在菜單 示范程序 下拉，看到for JavaScript 項；
進入到for JavaScript示范程序；
以下是第一個示范程序的源碼；
<!DOCTYPE html> <html> <head><meta charset="utf-8"><title>墨卡托投影系地圖</title><style type="text/css">body{margin: 0;overflow: hidden;background: #fff;}#map{position: relative;height: 553px;border:1px solid #3473b7;}</style><link href='./css/bootstrap.min.css' rel='stylesheet' /><link href='./css/bootstrap-responsive.min.css' rel='stylesheet' /><script src = '../libs/SuperMap.Include.js'></script><script type="text/javascript">var map, layer,host = document.location.toString().match(/file:\/\//) ? "http://localhost:8090" : 'http://' + document.location.host;url = host + "/iserver/services/map-china400/rest/maps/China";function init(){//初始化地圖map = new SuperMap.Map("map",{controls:[new SuperMap.Control.Navigation() ,new SuperMap.Control.Zoom()]});map.addControl(new SuperMap.Control.MousePosition());//初始化圖層layer = new SuperMap.Layer.TiledDynamicRESTLayer("China", url, null,{maxResolution:"auto"});//監聽圖層信息加載完成事件layer.events.on({"layerInitialized":addLayer});}//異步加載圖層function addLayer(){map.addLayer(layer);//顯示地圖范圍map.setCenter(new SuperMap.LonLat(0, 0), 1);}</script> </head><body onLoad = "init()"><div id = "map"></div></body> </html>看一下此發布的地圖的坐標系；
最常用于網絡地圖應用的兩個坐標系統是EPSG：4326和EPSG：3857。
EPSG：4326（又名WGS84，未投影）是一個地理的非項目坐標系。它是lat，longs GPS顯示器。它的單位是十進制度。EPSG：4326無法在平面地圖上以有意義的方式顯示。
EPSG：3857（又名Pseudo-Mercator，球形墨卡托或Web墨卡托）是投影坐標系。這是Google Maps和幾乎所有其他Web制圖應用程序使用的坐標系。
?
需要包含for Javascript的庫；SuperMap.Include.js；和相應的樣式文件；
?
<div id = "map"></div>
定義一個div，id為map，作為顯現地圖的容器；
樣式的#map{}部分，定義此容器的樣式；
?
host和url是發布的地圖服務網址；
?
map = new SuperMap.Map("map",{controls:[
??????????????????????? new SuperMap.Control.Navigation() ,
?????????????????????? new SuperMap.Control.Zoom()
??????????? ]});
初始化地圖；第一個參數是div的id；
在地圖上添加地圖瀏覽控件；Control.Navigation
Navigation是不可見控件，監聽鼠標點擊、平移、滾輪等事件來實現對地圖的瀏覽操作。
Control.Zoom()，在地圖上添加縮放控件；就是左上角的加減號的那個；
SuperMap.Control.MousePosition(); ? ? //該控件顯示鼠標移動時，所在點的地理坐標。
?
TiledDynamicRestLayer： 動態分塊圖層，用來對接SuperMap iServer 8C的分塊動態REST圖層服務
"China", 圖層名；
maxResolution {Float} 用于地圖實例化的時候設置最大分辨率（設置該值可以使地圖在分辨率達到某個值的時候無法 再縮小）。當不想將整張地圖都展示在通過 tileSize 指定大小的一張瓦 片上的時候設置該值。設置為auto的時候地圖會自適應視口大小。?
?
異步加載圖層；圖層信息加載完成，執行addLayer()；
map.addLayer(layer); 把圖層添加到地圖；
map.setCenter(new SuperMap.LonLat(0, 0), 1); 設置地圖中心點(0,0)；SuperMap.LonLat是超圖經緯度類；1是縮放級別。
總結
以上是生活随笔為你收集整理的超图 for javascript 版本入门程序讲解的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 超图iServer版本安装和使用入门图解
- 下一篇： React JSX 实例图解