arcgis server for javascript如何实现最短路径分析

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了arcgis server for javascript如何实现最短路径分析相关的知识,希望对你有一定的参考价值。

  第一步:首先必须在ArcCatalog中新建网络数据集,在网络图层点右键,选择新建网络数据集,如图所示,一路默认点击。如果你熟悉,修改其中的参数也可以。
  GZK09A)VRT506@~YCG)MX

  第二步:在ArcMap中新增网络分析层保存为MXD文档,注意的是需要安装扩展模块,如果没有,可以在安装光盘中查找。

  第三步:最后在ArcCatalog或者ArcGIS Server Manager中发布服务时发布,注意的是要选择网络分析服务。也就是NAServer。

  下面的工作就是在程序中来编写如何来获取最短路径了,分成了两种方式:

  第一种方式为客户端在地图控件上获取起始点,系统利用Ajax技术将起点与终点的屏幕坐标发送回GIS服务器,并通过服务器处理获取最短路径,以HTTP方式将结果发送回客户端,同时将最短路径显示在客户端浏览器中。

  第二种方式与前面一种不同之处在于客户端用户在起点与终点的文本框中输入地址或者地名,发送回服务器后,服务器通过自主开发的地址定位器获取最短路径。

  ArcGIS产品线为用户提供一个可伸缩的,全面的GIS平台。ArcObjects包含了大量的可编程组件,从细粒度的对象(例如单个的几何对象)到粗粒度的对象(例如与现有ArcMap文档交互的地图对象)涉及面极广,这些对象为开发者集成了全面的GIS功能。每一个使用ArcObjects建成的ArcGIS产品都为开发者提供了一个应用开发的容器,包括桌面GIS(ArcGIS Desktop),嵌入式GIS(ArcGIS Engine)以及服务端GIS(ArcGIS Server)。
参考技术A 早几天, 有朋友来信说希望我系统的全部讲一下这个例子,也就是从头开始,我整理了一下,不知道各位满意不,有什么不足,请指点。 另外大家有什么事情,直接在后面留言就是了,因为我看邮箱的时间要远远少于看博客的时间。
ArcGIS Server Network 扩展提供了基于网络的空间分析能力,包括路径、旅行方向、最近设施和服务区域分析。开发人员可以使用它构建和部署网络应用。在本次程序中,使用了NAServer来实现最短路径的查找,NAServer是ArcGIS Server在无状态环境下MapServer的扩展对象,注意的是在ArcGIS Server使用其实现网络功能,应该按照下面几步来操作:

第一步:首先必须在ArcCatalog中新建网络数据集,在网络图层点右键,选择新建网络数据集,如图所示,一路默认点击。如果你熟悉,修改其中的参数也可以。

GZK09A)VRT506@~YCG)MX

第二步:在ArcMap中新增网络分析层保存为MXD文档,注意的是需要安装扩展模块,如果没有,可以在安装光盘中查找。

第三步:最后在ArcCatalog或者ArcGIS Server Manager中发布服务时发布,注意的是要选择网络分析服务。也就是NAServer

下面的工作就是在程序中来编写如何来获取最短路径了,分成了两种方式:

第一种方式为客户端在地图控件上获取起始点,系统利用Ajax技术将起点与终点的屏幕坐标发送回GIS服务器,并通过服务器处理获取最短路径,以HTTP方式将结果发送回客户端,同时将最短路径显示在客户端浏览器中。

ArcGIS Server的最短路径开发系列(2)

第二种方式与前面一种不同之处在于客户端用户在起点与终点的文本框中输入地址或者地名,发送回服务器后,服务器通过自主开发的地址定位器获取最短路径。本回答被提问者和网友采纳

lzugis——Arcgis Server for JavaScript API之自己定义InfoWindow

用过Arcgis Server for JavaScript API肯定知道InfoWIndow。你在用InfoWindow的时候会发现各种问题,比如不能全然显示的问题,遮盖对象的问题等等。所以呢我在实现这个功能的时候动了下脑子,想自己用div+css弄一个,倒腾了半天,弄出来了一个例如以下所看到的的:

技术分享

做的比較丑陋,样式方面还得好好下下功夫。东西是差点儿相同实现了,以下说说思路:

首先。DIV定义,这个样式,我定义了5个div,各自是infowin,title,colse,content。arrow,当中。infowin是整个InfoWindow的大框架,title为标题。close为关闭button,content为主要内容,arrow为以下的小尾巴。我们能够将这个小尾巴做的长一点。以免对象被遮盖的情况,代码为:

    <div id="mapDiv">
    	<div id="infowin">
        	<div id="close" onClick="closeInfoWin()">X</div>
            <div id="title"></div>
            <div id="content"></div>
            <div id="arrow"></div>
        </div>
    </div>

定义了div就得进行布局。定义样式了,样式为:

    <style>
          html, body, #mapDiv 
	  {
                padding:0;
                margin:0;
                height:100%;
		font-size:10px;
		position: relative;
          }
	  #infowin
	  {		  
		  display:none;
		  z-index:10000;	  
	  }
	  #close
	  {
		  float:right;
		  padding-top:10px;
		  font-weight:bold;
		  font-size:12px;
		  color:#FFF;
		  border:#000 1px solid;
		  height:20px;
		  width:20px;
		  text-align:center;
	  }
	   #close:hover
	  {
		  cursor:pointer;
	  }
	  #title
	  {
		  background-color:#666;
		  padding:10px;
		  font-weight:bold;
		  font-size:12px;
	  }
	  #content
	  {
		  padding-left:10px;
		  padding-top:10px;
		  background-color:#999;
		  height:200px;
	  }
	  #arrow
	  {
		  background-image:url(arrow.png);
		  height:30px;
	  }
    </style>
样式定义完之后就得考虑事件了,一般InfoWindow是在点击某个对象时弹出来的,所以我们得定义对象图层的click事件:

		function leftClick(evt){
			infowin.style.display="none";
			
			var strtitle="城市名称"			
		  	var strcontent = "****是一座漂亮的城市<br><br>****是一座好看的城市<br><br>****是一座富饶的城市<br><br>****是一座漂亮的城市";
			
			infowin.style.left=(evt.clientX-width/2)+"px";
			infowin.style.top=(evt.clientY-height-50)+"px"; 
			infowin.style.position="absolute";
			infowin.style.width=width+"px";
			infowin.style.height=height+"px";
			infowin.style.display="block";
			
			title.innerHTML = strtitle;
			content.innerHTML = strcontent;

		}
		//鼠标单击
		featurelayercity.on("click", leftClick);
点击对象,在鼠标的点击位置出现。所以我们得将infowin的position样式设为absolute。并定义left和top分别为clientX和clientY,并将其display设置为block,将其显示,实现的具体代码例如以下:

<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples 
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
    <title>Feature Layer - display results as an InfoWindow onHover</title>

    <link rel="stylesheet" href="http://localhost/arcgis_js_api/library/3.8/3.8/js/dojo/dijit/themes/claro/claro.css">
	<link rel="stylesheet" href="http://localhost/arcgis_js_api/library/3.8/3.8/js/dojo/dijit/themes/tundra/tundra.css">
    <link rel="stylesheet" href="http://localhost/arcgis_js_api/library/3.8/3.8/js/esri/css/esri.css">
	<style>
      html, body, #mapDiv 
	  {
        padding:0;
        margin:0;
        height:100%;
		font-size:10px;
		position: relative;
      }
	  #infowin
	  {		  
		  display:none;
		  z-index:10000;	  
	  }
	  #close
	  {
		  float:right;
		  padding-top:10px;
		  font-weight:bold;
		  font-size:12px;
		  color:#FFF;
		  border:#000 1px solid;
		  height:20px;
		  width:20px;
		  text-align:center;
	  }
	   #close:hover
	  {
		  cursor:pointer;
	  }
	  #title
	  {
		  background-color:#666;
		  padding:10px;
		  font-weight:bold;
		  font-size:12px;
	  }
	  #content
	  {
		  padding-left:10px;
		  padding-top:10px;
		  background-color:#999;
		  height:200px;
	  }
	  #arrow
	  {
		  background-image:url(arrow.png);
		  height:30px;
	  }
    </style>    
    <script src="http://js.arcgis.com/3.9/"></script>
    <script>
	  var infowin,colse,title,content;
	  
	  var width=400,height=230;
	  
	  var closeInfoWin = function (evt){
		  infowin=document.getElementById("infowin");
		  infowin.style.display="none";
	  };

	  require([
        "esri/map", //地图
		"esri/layers/ArcGISTiledMapServiceLayer",
		"esri/layers/FeatureLayer",//特征层
		"esri/symbols/PictureMarkerSymbol",//图片点符号
        "esri/renderers/SimpleRenderer", //简单渲染
		"esri/graphic", //图片
		"esri/lang",		     
		"dojo/domReady!"
      ], function(
        Map,ArcGISTiledMapServiceLayer,FeatureLayer,PictureMarkerSymbol,SimpleRenderer,esriLang
      ) {
        var map = new Map("mapDiv", {
		  logo:false,
          center: [106.6854, 35.8364],
          zoom: 4,
          slider: true
        });	
		
		var shpServiceURL="***************************************";
		var shpTitlelayer=new ArcGISTiledMapServiceLayer(shpServiceURL);
		map.addLayer(shpTitlelayer);

		//--------------------------------------------------------------------------------------------------------
		var featurelayercity = new FeatureLayer("******************************************************", {
          mode: FeatureLayer.MODE_SNAPSHOT,
          outFields: ["*"]
        });
	    var pmsRed = new PictureMarkerSymbol(‘../images/location_icon_blue.png‘, 20, 20).setOffset(0, 15);
		//简单渲染
		var sr=new SimpleRenderer(pmsRed);
		featurelayercity.setRenderer(sr);		
        map.addLayer(featurelayercity);	
		
		infowin = document.getElementById("infowin");
	 	colse = document.getElementById("close");
	  	title = document.getElementById("title");
	  	content = document.getElementById("content");
		function leftClick(evt){
			infowin.style.display="none";
			
			var strtitle="城市名称"			
		  	var strcontent = "****是一座漂亮的城市<br><br>****是一座好看的城市<br><br>****是一座富饶的城市<br><br>****是一座漂亮的城市";
			
			infowin.style.left=(evt.clientX-width/2)+"px";
			infowin.style.top=(evt.clientY-height-50)+"px"; 
			infowin.style.position="absolute";
			infowin.style.width=width+"px";
			infowin.style.height=height+"px";
			infowin.style.display="block";
			
			title.innerHTML = strtitle;
			content.innerHTML = strcontent;

		}
		//鼠标单击
		featurelayercity.on("click", leftClick);		
      });
    </script>
  </head>
  <body class="tundra">
    <div id="mapDiv">
    	<div id="infowin">
        	<div id="close" onClick="closeInfoWin()">X</div>
            <div id="title"></div>
            <div id="content"></div>
            <div id="arrow"></div>
        </div>
    </div>
  </body>
</html>
眼下仅仅实现到了这儿, 还有下面问题待解决:1、地图拖动后infowin随着地图的联动。2、地图缩放后infowin随着地图的联动;3、内容不在可视范围时候的移动;4、样式。挺难看的。希望有人实现后共享下代码,造福全GISer。


lzugis










以上是关于arcgis server for javascript如何实现最短路径分析的主要内容,如果未能解决你的问题,请参考以下文章

ArcGIS 10.3 for Server新特性介绍

关于ArcGis for javascrept查询ArcGis server图层信息的方式

ArcGIS Enterprise 10.5.1 静默安装部署记录(Centos 7.2 minimal版)- 3安装 ArcGIS for Server

[转]arcgis for server 10.2 下载及安装

使用地图切片并最终将地图发布在arcgis for server

arcgis server for javascript如何实现最短路径分析