2. 程式人生 > >ArcGIS API for JavaScript 實現point multipoint line polyline cirle等graphics的繪製

ArcGIS API for JavaScript 實現point multipoint line polyline cirle等graphics的繪製

阿新 • • 發佈：2019-01-18
var map, tb; require([ "esri/map", "esri/toolbars/draw", "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "esri/symbols/PictureFillSymbol", "esri/symbols/CartographicLineSymbol", "esri/graphic"
, "esri/Color", "dojo/dom", "dojo/on", "dojo/domReady!" ], function( Map, Draw, SimpleMarkerSymbol, SimpleLineSymbol, PictureFillSymbol, CartographicLineSymbol, Graphic, Color, dom, on )
{ map = new Map("mapDiv", { basemap: "streets", center: [-25.312, 34.307], zoom: 3 }); map.on("load", initToolbar); // markerSymbol is used for point and multipoint, see http://raphaeljs.com/icons/#talkq for more examples
var markerSymbol = new SimpleMarkerSymbol(); markerSymbol.setPath("M16,4.938c-7.732,0-14,4.701-14,10.5c0,1.981,0.741,3.833,2.016,5.414L2,25.272l5.613-1.44c2.339,1.316,5.237,2.106,8.387,2.106c7.732,0,14-4.701,14-10.5S23.732,4.938,16,4.938zM16.868,21.375h-1.969v-1.889h1.969V21.375zM16.772,18.094h-1.777l-0.176-8.083h2.113L16.772,18.094z"); markerSymbol.setColor(new Color("#00FFFF")); // lineSymbol used for freehand polyline, polyline and line. var lineSymbol = new CartographicLineSymbol( CartographicLineSymbol.STYLE_SOLID, new Color([255,0,0]), 10, CartographicLineSymbol.CAP_ROUND, CartographicLineSymbol.JOIN_MITER, 5 ); // fill symbol used for extent, polygon and freehand polygon, use a picture fill symbol // the images folder contains additional fill images, other options: sand.png, swamp.png or stiple.png var fillSymbol = new PictureFillSymbol("images/mangrove.png", new SimpleLineSymbol(SimpleLineSymbol.STYLE_SOLID, new Color('#000'), 1), 42, 42); function initToolbar() { tb = new Draw(map); tb.on("draw-end", addGraphic); on(dom.byId("info"), "click", function(evt) { if ( evt.target.id === "info" ) { return; } var tool = evt.target.id.toLowerCase(); map.disableMapNavigation(); tb.activate(tool); }); } function addGraphic(evt) { //deactivate the toolbar and clear existing graphics tb.deactivate(); map.enableMapNavigation(); // figure out which symbol to use var symbol; if ( evt.geometry.type === "point" || evt.geometry.type === "multipoint") { symbol = markerSymbol; } else if ( evt.geometry.type === "line" || evt.geometry.type === "polyline") { symbol = lineSymbol; } else { symbol = fillSymbol; } map.graphics.add(new Graphic(evt.geometry, symbol)); } });

相關推薦

ArcGIS API for JavaScript 實現point multipoint line polyline cirle等graphics的繪製

var map, tb; require([ "esri/map", "esri/toolbars/draw", "esri/symbols/SimpleMarkerSymbol",

ArcGIS API for JavaScript實現地圖常用工具條 距離測量，面積測量

距離測量，面積測量等工具條是常用的工具。也是GIS系統的基礎功能 效果圖 工具條樣式： 距離測量： 面積測量： require([ "esri/map", "esri/layers/ArcGISDynamicMapServi

ArcGIS API for JavaScript實現分圖層顯示

大家都知道，當用ArcGIS釋出地圖服務時，是把整個地圖文件所有圖層都發布出去的，如果展示的時候只想顯示某個圖層怎麼辦呢？或許你會用FeatureLayer，這樣做當然也能實現，但是在地圖文件中

ArcGIS API for JavaScript實現地圖雙屏聯動

使用ArcGIS API for JavaScript，可以很方便的實現地圖聯動。最簡單的方式是藉助Map物件的extent-change 事件，當然，也可以藉助zoom-end、pan-end、mouse-drag-end等事件，本文使用第一種方式，實現地圖的平移聯動、滑

ArcGIS API for js 實現點、線、面等圖形的繪畫

今天總算敲定實習的事，也不知道未來等待我的將是什麼，但是我知道我既然選擇了就要把它做好，選擇就不要後悔，走下去====開車開車一、實現的思路首先宣告一個GraphicLayer的圖層，（該圖層是客戶端型別圖層，與ArcGIS Server釋出的圖層沒有任何聯絡，繪畫的物件也在

ArcGIS API For JavaScript（三）QueryTask&IdentifyTask實現空間查詢

ArcGIS API For JavaScript（三）QueryTask&IdentifyTask實現空間查詢 1、通過QueryTask（）實現空間查詢 在地圖上畫一個多邊形，將和多邊形相交的要素找出並高亮顯示，之後動態新增表格，將要素的名稱依次顯示在表格中   <

ArcGIS API For Javascript之顏色分類實現

   在博文（http://blog.csdn.net/lovecarpenter/article/details/52672046）的基礎上，利用該文章中的客戶端渲染唯一值實現了功能。但是做了修改，我渲染的是SimpleLineSymbol。在API3.8的版本中set

ArcGIS api for javascript+jquery實現簡單的圖層控制切換

這一個功能網上有很多版本，快被寫爛了。寫這篇部落格的初衷是給各位不是GIS行業或沒有接觸過這個東東的猿們一些幫助。或許還有更簡單或者相似的希望大家看了之後可以提出來一起討論。只是很初級的程式碼，希望各位大大路過輕噴。歡迎交流。話不多說，咱們開始。 首先在已有地圖物件及圖層的

ArcGIS API For JavaScript（三）QueryTask&IdentifyTask實現空間查詢

ArcGIS API For JavaScript（三）QueryTask&IdentifyTask實現空間查詢1、通過QueryTask（）實現空間查詢在地圖上畫一個多邊形，將和多邊形相交的要素找出並高亮顯示，之後動態新增表格，將要素的名稱依次顯示在表格中<!

Arcgis API for JavaScript在地圖上實現手機定位資訊的追蹤顯示

/* 定義全域性變數 */ var ulm_Int = null;//儲存手機定位資訊輪詢setInterval的id var isFirstQuery = null;//定義一個變數儲存是否是第一次查詢 var ulm_Layer = null;//手機定位資訊圖層變數 var ulm_queryResul

使用Arcgis Api for Javascript 調用 本地Portal發布的WebMap

pla basemap 步驟 reat 地址 dap toc cli 配置 步驟： 安裝Arcgis Portal 10.4,Server 10.4,DataStore ,WebAdaptor for IIS,搭建arcgis api for javascript 4

ArcGIS API for JavaScript學習（1）：第一個地圖

樣式表 參數 資源 charset 底層 arcgis 順序 api navi 1.簡介 ArcGIS API for JavaScript跟隨ArcGIS 9.3同時發布，是ESRI根據JavaScript技術實現的調用ArcGIS Server REST API接口的一

ArcGIS API for JavaScript 4.4學習筆記[新] AJS4.4和AJS3.21新特性

ack 讀取 port 不同 ide evel arc ges wfs ESRI官網悄無聲息突然更新4.4和3.21，公眾號也沒有什麽消息。照例，給大家看看這次更新有什麽新特性吧。 1. AJS 4.4 官方更新日誌：點我，比較詳細。我在這裏抽一些主幹作為說明。 1.1

Arcgis api for javascript學習筆記-三維地圖的飛行效果

com init viewport window eight put div speed null 其實就只是用到了 view.goTo() 函數，再利用 window.setInterval() 函數(定時器)定時執行goTo()。代碼如下： <!DOCTYP

ArcGIS API for JavaScript 4.6 版本加載高德地

地理信息ArcGIS API for JavaScript 4.X 版本升級後，API發生了很大的變化。 其中就支持了WebEarth展示，主要是通過 esri/views/SceneView 實現的。 在新版本中，默認都是加載Esri自己的地圖。 若想加載其他地圖，可以通過擴展BaseTileLayer實現

ArcGIS API for JavaScript 4.x 與 npm

resolved 進行 ali IE fun IT rop async creat 在4.7版本中，不僅增加了WebGL的渲染支持（渲染前端速度加快，渲染量也加大）、增強了ES6中的Promises語法支持，還支持了npm管理及webpack打包，實屬喜訊。 “意味著可以

ArcGIS API for JavaScript 與 npm 之例子運行

node 服務器環境 arcgis dem git ive bubuko 下載 module 下載官方的demo，4.7的，在終端裏跑了一下，測試成功（未打包） 在測試中精簡掉了不需要的文件，使用http協議跑的（file協議不行哦） 最簡單的目錄如下： 我把以上文件放到

Arcgis api for javascript學習筆記(4.6版本) - 二維MapView中的FeatureLayer顯示標註

meta AS dojo each 自己 round updating 完成後 graph 4.6版本api的FeatureLayer中有提供 labelsVisible 和 labelingInfo 兩個屬性，設置這兩個屬性可以實現顯示將屬性中某個字段作為標註。但是這兩個

[ArcGIS API for JavaScript 4.8] Sample Code-Get Started-widgets簡介

idg com mapview list star evel 好的 gin views 【官方文檔：https://developers.arcgis.com/javascript/latest/sample-code/intro-widgets/index.html】

用Tomcat8.5做Arcgis API for javascript的本地部署

step1:1從arcgis官網上下載Arcgis api for JavaScript 4.3    https://developers.arcgis.com/javascript/latest/guide/release-notes/ ps:前提是你需要有一個esri開