當前位置:
首頁 >
前端技术
> javascript
>内容正文
javascript
ArcGIS API for JavaScript Bookmarks(书签)
生活随笔
收集整理的這篇文章主要介紹了
ArcGIS API for JavaScript Bookmarks(书签)
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
說明:本篇博文介紹的是ArcGIS API for JavaScript中的 Bookmarks(書簽) ,書簽的作用是,把地圖放大到一個地方 添加書簽,書簽名稱可以和地圖名稱一直,單擊標簽 地圖會定位到剛才選中的地方。大致就是這個意思!
有關(guān)ArcGIS API for JavaScriptde的引用文件的部署 請參考我的前面的博客
原文地址:https://blog.csdn.net/xiaokui_wingfly/article/details/8500026
1、運行效果
?
2、html代碼
<!doctype html> <html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=7,IE=9"><meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"><title>Bookmark Widget</title> <link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_api/library/3.3/jsapi/js/dojo/dijit/themes/nihilo/nihilo.css"/> <link rel="stylesheet" type="text/css" href="http://localhost/arcgis_js_api/library/3.3/jsapi/js/esri/css/esri.css" /><style>html, body { height: 100%; width: 100%;margin: 0; padding: 0;} body{background-color: #fff; overflow:hidden; font-family: sans-serif;} #header {padding-top: 4px;padding-left: 15px;background-color:#444; color:#fff; font-size:16pt; text-align: left; font-weight:bold;height:55px;}#subheader {font-size:small;color: #cfcfcf;text-align:left;}#bookmarks-wrapper {position: absolute;z-index: 40;top: 15px;right: 30px;background: transparent;font-size: 12pt;color: #444;} .ds { background: #000; overflow: hidden; position: absolute; z-index: 2; }#ds-h div { width: 100%; }#ds-l div { height: 100%; }#ds .o1 { filter: alpha(opacity=10); opacity: .1; }#ds .o2 { filter: alpha(opacity=8); opacity: .08; }#ds .o3 { filter: alpha(opacity=6); opacity: .06; }#ds .o4 { filter: alpha(opacity=4); opacity: .04; }#ds .o5 { filter: alpha(opacity=2); opacity: .02; }#ds .h1 { height: 1px; }#ds .h2 { height: 2px; }#ds .h3 { height: 3px; }#ds .h4 { height: 4px; }#ds .h5 { height: 5px; }</style><script>var dojoConfig = {parseOnLoad: true // 解析 };</script><script type="text/Javascript" src="http://localhost/arcgis_js_api/library/3.3/jsapi/init.js"></script><script>// 導入包 dojo.require("dijit.layout.BorderContainer");dojo.require("dijit.layout.ContentPane");dojo.require("dijit.form.DropDownButton");dojo.require("esri.map");dojo.require("esri.dijit.Bookmarks");var map, bookmarks;function init() {map = new esri.Map("map", {basemap: "topo",center: [-100, 40],zoom: 4});// 書簽可以被指定為一個數(shù)組對象結(jié)構(gòu):// { extent: <esri.geometry.Extent>, name: <some string> }var bookmarks_list = [{"extent": { // 范圍"spatialReference": { // 空間參考"wkid": 102100},"xmin": -14201669, // 左下角X"ymin": 4642975, // 左下角Y"xmax": -13021482, // 右上角X"ymax": 5278931 // 右上角Y },"name": "Northern California(北加州)"}, {"extent": {"spatialReference": {"wkid": 102100},"xmin": -8669334,"ymin": 4982379,"xmax": -8664724,"ymax": 4984864},"name": "Central Pennsylvania(賓夕法尼亞州中部)"}];// 創(chuàng)建書簽組件 bookmarks = new esri.dijit.Bookmarks({map: map,editable: true, // 可允許編輯。默認false則只讀模式 bookmarks: bookmarks_list // Array / JSON }, dojo.byId('bookmarks'));// 綁定移除標簽事件 dojo.connect(bookmarks, "onRemove", function () {alert('刪除成功,32版本尚未找到二次確認刪除標簽,如有方案,請留言,多謝');});}// 加載時顯示 dojo.ready(init);</script></head><body class="nihilo"><div id="mainWindow" data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline',gutters:false" style="width: 100%; height: 100%; margin: 0;"><div id="header" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'top'">Bookmark Widget Sample <div id="subheader">書簽</div><!-- 書簽在一個下拉框的里面 --><div id="bookmarks-wrapper"><div data-dojo-type="dijit.form.DropDownButton"><span>Bookmarks(書簽)</span><div data-dojo-type="dijit.TooltipDialog"><div id="bookmarks"></div></div></div></div></div><div id="map" class="shadow" data-dojo-type="dijit.layout.ContentPane" data-dojo-props="region:'center'"><div id="ds"> <!-- 陰影div --><div id="ds-h"><div class="ds h1 o1"></div><div class="ds h2 o2"></div><div class="ds h3 o3"></div><div class="ds h4 o4"></div><div class="ds h5 o5"></div></div></div> <!-- end drop shadow divs --></div></div></body> </html>?其中的代碼
map = new esri.Map("map", {basemap: "topo",center: [-100, 40],zoom: 4});也可以替換為以下形式
map = new esri.Map("map", { center: [-100, 40], zoom: 4 });
MyTiledMapServiceLayer = new esri.layers.ArcGISTiledMapServiceLayer
("http://localhost/arcgis/rest/services/DZDT2012/MapServer");
map.addLayer(MyTiledMapServiceLayer);
轉(zhuǎn)載于:https://www.cnblogs.com/net064/p/10308282.html
總結(jié)
以上是生活随笔為你收集整理的ArcGIS API for JavaScript Bookmarks(书签)的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 坚持是一件很难的事情
- 下一篇: AM8不能下任何载附件及所有聊天记录无法