arcgis api for4.x 绘制圆，及坐标转换问题
生活随笔
收集整理的這篇文章主要介紹了
arcgis api for4.x 绘制圆，及坐标转换问题
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
繪制多個圓，類似雷達的功能。
<!DOCTYPE html> <html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Document</title><link rel="stylesheet" hrel="http://localhost/4.17/esri/css/main.css" /><script src="http://localhost/4.17/dojo/dojo.js"></script><style>html,body,#viewDiv {height: 100%;width: 100%;margin: 0;padding: 0;}</style><script>require(["esri/Map","esri/Basemap","esri/views/MapView","esri/views/SceneView","esri/geometry/Extent","esri/geometry/SpatialReference",//幾何"esri/geometry/Point","esri/geometry/Polyline","esri/geometry/Polygon","esri/geometry/Circle","esri/Graphic","esri/widgets/Sketch","esri/Color",//切片地圖信息"esri/layers/support/TileInfo",//圖層"esri/layers/WebTileLayer","esri/views/layers/LayerView","esri/layers/TileLayer","esri/layers/MapImageLayer","esri/layers/FeatureLayer","esri/layers/GraphicsLayer",//符號化"esri/symbols/SimpleMarkerSymbol","esri/symbols/SimpleFillSymbol","esri/symbols/SimpleLineSymbol",//緩沖參數，用于GeometryService"esri/tasks/support/BufferParameters",//幾何處理，投影、簡化、緩沖區"esri/tasks/GeometryService",//幾何引擎，用于測試、測量和分析兩個或多個二維幾何圖形之間的空間關系,緩沖、修剪、距離、相交、聯合、面積距離計算等。"esri/geometry/geometryEngine",//代理"esri/core/urlUtils",//查詢"esri/tasks/FindTask","esri/tasks/support/FindParameters","esri/tasks/QueryTask","esri/tasks/support/Query","esri/tasks/IdentifyTask","esri/tasks/support/IdentifyParameters",//打印地圖"esri/tasks/PrintTask","esri/tasks/support/PrintTemplate","esri/tasks/support/PrintParameters","dojo/dom","dojo/on","dojo/domReady!"], function(Map,Basemap,MapView,SceneView,Extent,SpatialReference,Point,Polyline,Polygon,Circle,Graphic,Sketch,Color,TileInfo,WebTileLayer,LayerView,TileLayer,MapImageLayer,FeatureLayer,GraphicsLayer,SimpleMarkerSymbol,SimpleFillSymbol,SimpleLineSymbol,BufferParameters,GeometryService,geometryEngine,urlUtils,FindTask,FindParameters,QueryTask,Query,IdentifyTask,IdentifyParameters,PrintTask,PrintTemplate,PrintParameters,dom,on) {var layer = new MapImageLayer({url: "http://localhost:6080/arcgis/rest/services/Qingdao/MapServer"});var map = new Map({ //屬性：allLayers、ground、layersbasemap: "topo",layers: [layer]});var view = new MapView({container: "viewDiv",map: map,zoom: 11,SpatialReference: {wkid: 102100,},center: [120.389583, 36.085579] // longitude, latitude});var graphicLayer = new GraphicsLayer();map.add(graphicLayer);view.on("click", function(eve) {var len = 10;var rads = 10000;var rad = rads / len;for (var i = 0; i < len; i++) {var circle = new Circle({type: "circle",center: [eve.mapPoint.longitude, eve.mapPoint.latitude],radius: i * rad,geodesic: true,radiusUnit: "meters",spatialReference: {wkid: 102100}});var SimpleLineSymbol = {type: "simple-line",color: [255, 0, 0],style: "solid",width: 2};var graphic = new Graphic({geometry: circle,symbol: SimpleLineSymbol});graphicLayer.add(graphic);}});});</script> </head><body><div id="viewDiv"></div> </body></html>屏幕坐標
2.經緯度坐標與xy坐標轉換問題。
首先，說一下，投影方式。目前常用的投影方法有墨卡托投影（正軸等角圓柱投影)
高斯-克呂格爾投影。
2000國家大地坐標系：高斯-克呂格爾投影
西安80：高斯-克呂格爾投影
北京54：高斯-克呂格爾投影
WGS84(World Geodetic System 1984):墨卡托投影
說一下地理坐標與投影坐標轉換的問題
arcgis api for js 使用官方的底圖的話，采用的是WGS84地理坐標系即：GCS_WGS_1984，wkid: 4326 。
對應的投影坐標系為：WGS_1984_web_mercator_auxiliary_sphere，采用的是墨卡托投影，wkid: 102100。
所以那官方底圖的wkid為102100。
我們使用的地圖服務基本是高斯-克呂格爾投影。
MapView類有兩個方法，實現屏幕上的坐標（不是投影坐標）與經緯度坐標（地理坐標）的互轉。
const mapPoint = {x: eve.mapPoint.longitude,y: eve.mapPoint.latitude,spatialReference: {wkid: 4326}};//const center = view.toMap(eve); //屏幕上的坐標轉經緯度坐標const center = view.toScreen(mapPoint); / /經緯度坐標轉屏幕上的坐標不過沒看出啦啥用。繼續
一、墨卡托投影。
如果底圖采用的是官方默認的：topo、terrain、streets-relief-vector、streets-night-vector、streets-navigation-vector、streets、satellite、osm、oceans、national-geographic、hybrid、gray、dark-gray
也就是墨卡托投影。可以使用webMercatorUtils對象提供的方法進行地理坐標與投影坐標的互相轉換。
實現思路：為MapView添加view.on(“click”, function(eve) {});
回掉函數的參數eve,是個Object，里面有坐標的經緯度坐標（地理坐標），xy坐標（投影坐標）信息。
不過xy坐標的值是反的。
require([“esri/geometry/support/webMercatorUtils”], function(webMercatorUtils) {});
var map = new Map({ //屬性：allLayers、ground、layersbasemap: "topo"});var view = new MapView({container: "viewDiv",map: map,zoom: 11,SpatialReference: {wkid: 102100, //},center: [120.389583, 36.085579] // longitude, latitude}); view.on("click", function(eve) {//xyToLngLat(x, y),參數x：要轉換的X坐標值。參數y:要轉換的X坐標值。//將給定的Web墨卡托坐標轉換為經度和緯度值（十進制度數）。默認情況下，返回的經度是標準化的，//因此它在-180和+180之間//webMercatorUtils類型為Object,var center = webMercatorUtils.xyToLngLat(eve.mapPoint.x, eve.mapPoint.y);//返回值類型為Number[]。經緯度數組 [120.33430803661913, 36.161841322559646]console.log(center);//lngLatToXY(long, lat)//參數 long：要轉換的經度值。lat：要轉換的緯度值//將給定的緯度和經度（十進制度數）值轉換為Web墨卡托XY值。//返回值類型 Number[]//geographicToWebMercator(geometry)//參數 geometry：要轉換的輸入幾何體。//將幾何圖形從地理單位（wkid:4326）轉換為Web墨卡托單位（wkid:3857）。//返回值類型 Geometry。//webMercatorToGeographic(geometry) //參數 geometry：要轉換的輸入幾何體。//將幾何圖形從Web墨卡托單位（wkid:3857）轉換為地理單位（wkid:4326）。//返回值類型 Geometry//project(geometry, spatialReference)//參數 geometry：輸入幾何體。spatialReference：目標空間引用或具有空間引用特性（如幾何體或地圖）//的對象。//投影幾何體客戶端（如果可能）。//返回值類型 Geometry。 }二、高斯-克呂格投影
在不用官方的底圖情況下，使用自己構建的底圖。
var basemap = new Basemap({baseLayers: [new FeatureLayer({url: "http://localhost:6080/arcgis/rest/services/qingdao/MapServer/5",title: "Basemap"})],title: "basemap",id: "basemap"});var map = new Map({ //屬性：allLayers、ground、layersbasemap: basemap});var view = new MapView({container: "viewDiv",map: map,zoom: 11,SpatialReference: {wkid: 102100,},center: [120.389583, 36.085579] // longitude, latitude});view.on("click", function(event) {view.hitTest(event).then(function(response) {console.log(response);});});打印結果：
可見 經緯度為null,xy坐標是有的，要想把xy左邊轉為經緯度。需要自己算。算法網上有。
總結
以上是生活随笔為你收集整理的arcgis api for4.x 绘制圆，及坐标转换问题的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： bootice添加黑苹果引导_OpenC
- 下一篇： 手机QQ资料html,手机怎么把QQ资料