arcgis3.20 版本获取线段长度与区域面积的方法

最新推荐文章于 2024-01-30 18:57:52 发布

一月清辉

最新推荐文章于 2024-01-30 18:57:52 发布

阅读量1k

点赞数

分类专栏： Arcgis专栏

本文链接：https://blog.csdn.net/yiyueqinghui/article/details/115082481

版权

Arcgis专栏专栏收录该内容

13 篇文章 2 订阅

订阅专栏

获取线段长度

esri.geometry.geodesicLengths(geometry,unit)

获取区域面积

esri.geometry.geodesicAreas(geomery,unit)

Demo示例

<!DOCTYPE html>
<!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>获取线段距离、区域面积</title>
		<link rel="stylesheet" href="http://js.arcgis.com/3.14/dijit/themes/claro/claro.css">
		<link rel="stylesheet" href="http://js.arcgis.com/3.14/dojox/widget/ColorPicker/ColorPicker.css">
		<link rel="stylesheet" href="http://js.arcgis.com/3.14/esri/css/esri.css">
		<style>
			html,
			body,
			#map {
				height: 100%;
				width: 100%;
				margin: 0;
				padding: 0;
			}
			.title{
				display: inline-block;
				position: fixed;
				top: 20px;
				left: 0;
				right:0;
				margin:0 auto;
				z-index:100;
				text-align: center;
			}
		</style>
		<script src="http://js.arcgis.com/3.14/"></script>
		<script>
			var map;
			//方法一  
			require([
				"esri/map", 
				"esri/geometry/Point",
				"esri/SpatialReference",
				"esri/symbols/SimpleMarkerSymbol",
				"esri/symbols/SimpleLineSymbol", 
				"esri/Color",
				"esri/graphic",
				"esri/geometry/geometryEngine"
			], function(Map, Point, SpatialReference, SimpleMarkerSymbol,SimpleLineSymbol,Color,Graphic,geometryEngine) {
				//实例化地图
				map = new Map("map", {
					basemap: "topo",
					center: [116.397428, 39.90923],
					zoom: 13
				});

				//加载时标记点
				map.on("load", function(){
					drawPolygon();
					drawLine();
					
					map.graphics.on('click',function(evt){
						console.log(evt);
						if(evt.graphic.geometry.type == 'polyline'){
							var distance = getDis(evt.graphic.geometry);
							var content = "<p><label>线段距离: </label><span>" + distance + "千米</span></p>";
							showInfo(content,evt.mapPoint)
						}else if(evt.graphic.geometry.type == 'polygon'){
							var area = getArea(evt.graphic.geometry);
							var content = "<p><label>区域面积: </label><span>" + area + "平方公里</span></p>";
							showInfo(content,evt.mapPoint)
						}
					})
				});

				function drawLine(){
					//标记图标
					var symbol = new esri.symbol.SimpleLineSymbol(
						esri.symbol.SimpleLineSymbol.STYLE_SOLID, 
						new esri.Color([245,12,198]), 
						10
					);
                    var polyline1 = new esri.geometry.Polyline([
                    	[116.357428, 39.90923],[116.357428, 39.95923]
                    ]);
					var graphic1 = new Graphic(polyline1, symbol);
                    
                    
                    var polyline2 = new esri.geometry.Polyline([
                    	[116.357428, 39.90923],[116.377428, 39.90923]
                    ]);
                    var graphic2 = new Graphic(polyline2, symbol);
					//实例化

					//增加到地图上
					map.graphics.add(graphic1);
					map.graphics.add(graphic2);
					
				};
				
				function drawPolygon(){
					//标记图标
					var symbol = new esri.symbol.SimpleFillSymbol(
			            esri.symbol.SimpleFillSymbol.STYLE_SOLID,
			            new esri.symbol.SimpleLineSymbol(
			              esri.symbol.SimpleLineSymbol.STYLE_SOLID,
			              new esri.Color([255,0,0,0.65]), 2
			            ),
			            new esri.Color([255,0,0,0.35])
			        );
                    var polygon = new esri.geometry.Polygon({
                    	"rings":[ [[116.357428, 39.90923],[116.377428, 39.90923],[116.377428, 39.95923],[116.357428, 39.95923]]],
                    	"spatialReference":{
                    		"wkid":4326 
                    	}
                    });
					//实例化
					var graphic = new Graphic(polygon, symbol);
					//增加到地图上
					map.graphics.add(graphic);
					
				}
				
				
				//获取距离
				function getDis(geometry){
					var distance = esri.geometry.geodesicLengths([geometry],esri.Units.KILOMETERS)[0];
					distance = distance.toFixed(2)
		            return Number(distance);
				}
				
				//获取面积
				function getArea(geometry){
					var area = esri.geometry.geodesicAreas([geometry],esri.Units.SQUARE_KILOMETERS)[0];
					area = area.toFixed(2)
		            return Math.abs(area);
				}
				
				//显示弹窗
				function showInfo(content,point){
					map.infoWindow.setTitle('详细信息');
					map.infoWindow.resize(250, "auto");
					map.infoWindow.setContent(content);
				    map.infoWindow.show(map.toScreen(point));
				}
				
				
				
			});
		</script>
	</head>
	<h1 class="title">点击线段、区域显示相应的长度或面积</h1>
	<div id="map"></div>
	</body>

</html>

一月清辉

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
arcgis3.20 版本获取线段长度与区域面积的方法

获取线段长度esri.geometry.geodesicLengths(geometry,unit)获取区域面积esri.geometry.geodesicAreas(geomery,unit)Demo示例<!DOCTYPE html><!DOCTYPE html><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
复制链接

扫一扫

专栏目录