14 新增影像圖層
阿新 • • 發佈:2018-10-31
上一篇文章中我們介紹瞭如何向地圖新增切片圖層,這篇文章介紹如何新增影像圖層。如果要實現此功能,同樣的,我們需要“esri/layers/ArcGISImageServiceLayer”元件,通過例項化一個地圖,然後例項化一個影像圖層,再用map的addLayer方法將它新增到地圖之上,效果如下:
具體操作如下所示:
1 例項化地圖:
map = new Map("map", {
basemap: "osm",
center: [89.689085,39.09635],
zoom: 6
});
2 例項化影像圖層並新增至地圖之上:
var imageServiceLayer = new ArcGISImageServiceLayer(" https://xqwserver.arcgis.cn:6443/arcgis/rest/services/imageservertest/ImageServer", {
opacity: 0.75
});
map.addLayer(imageServiceLayer);
3 至此,我們實現了將一個影像圖層新增在地圖之上,此處只是一個簡單的演示,關於具體的需求,大家可以檢視此API的文件來進行進一步的操作。完整程式碼如下:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"> <title>Simple Image Service</title> <link rel="stylesheet" href="https://js.arcgis.com/3.25/esri/css/esri.css" /> <style> html, body, #map { height: 100%; width: 100%; margin: 0; padding: 0; } </style> <script src="https://js.arcgis.com/3.25/"></script> <script> var map; require([ "esri/map", "esri/layers/ArcGISImageServiceLayer", "dojo/parser", "dojo/domReady!" ], function( Map, ArcGISImageServiceLayer, parser ) { parser.parse(); map = new Map("map", { basemap: "osm", center: [89.689085,39.09635], zoom: 6 }); var imageServiceLayer = new ArcGISImageServiceLayer(" https://xqwserver.arcgis.cn:6443/arcgis/rest/services/imageservertest/ImageServer", { opacity: 0.75 }); map.addLayer(imageServiceLayer); }); </script> </head> <body> <div id="map"> </div> </body> </html>