這玩意的背景閑話不說,先整一個出圖的入門範例。
為:
http://support.supermap.com.cn/ProductCenter/DownloadCenter/DownloadPage.aspx?id=59
解壓後目錄如下:
1、拷貝需要引用的資源
在本機建立一個檔案夾,GettingStarted,然後把剛剛前面解壓的檔案夾中的resource、libs檔案夾拷貝到GettingStarted檔案夾中。
2、在GettingStarted檔案夾下建立一個GettingStarted.html檔案,然後代碼如下:
<!DOCTYPE HTML><html> <head> <title>SuperMap iClient for JavaScript:TiledDynamicRESTLayer</title> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=UTF-8"/> <!--引用需要的指令碼--> <script src="libs/SuperMap.Include.js" type="text/javascript"></script> <script src="libs/GettingStarted.js" type="text/javascript"></script> </head> <body onload="dowork()"> <!--地圖顯示的div--> <div id="map" style="position:absolute;left:0px;right:0px;width:800px;height:500px;"> </div> </body></html>
3、在libs檔案夾下建立GettingStarted.js檔案,代碼如下:
var map, layerWorld;var world = "http://localhost:8090/iserver/services/map-world/rest/maps/World";function dowork() { map = new SuperMap.Map("map", { controls: [ new SuperMap.Control.LayerSwitcher(), new SuperMap.Control.ScaleLine(), new SuperMap.Control.OverviewMap(), new SuperMap.Control.PanZoomBar(), new SuperMap.Control.Navigation({ dragPanOptions: { enableKinetic: true } })], allOverlays: true, tileSize:new SuperMap.Size(512,512) }); layerWorld = new SuperMap.Layer.TiledDynamicRESTLayer("World",world,{transparent:false,cacheEnabled:true},{transitionEffect:"null"}); layerWorld.events.on({"layerInitialized":addLayer});}function addLayer(){ map.addLayers([layerWorld]); map.setCenter(new SuperMap.LonLat(118, 40), 3);}
4、啟動依賴的SuperMap iServer Java 6 服務,使用預設的範例資料。雙擊GettingStarted.html檔案瀏覽即可,如果瀏覽器彈出如表單
點擊允許阻止內容即可。