ArcGIS API for Javascript  API下载地址：http://support.esrichina-bj.cn/2011/0223/960.html

选择最新的下载就好了，目前是3.9

VS2010 C# 新建项目-ASP.NET Web应用程序即可。

API解压后把C:\inetpub\wwwroot\arcgis_js_v39_api复制到C:\inetpub\wwwroot\路径下，同时加载到程序中。

新建asp.net程序后，修改arcgis_js_v39_api\arcgis_js_api\library\3.9\3.9compact\init.js文件，即将“[HOSTNAME_AND_PATH_TO_JSAPI]”替换为”localhost/arcgis_js_v39_api\arcgis_js_api\library\3.9\3.9compact\js”

Localhost是服务器名，这里用的本机。

使用web js：

<link rel="stylesheet"href="http://js.arcgis.com/3.9/js/dojo/dijit/themes/tundra/tundra.css">

<link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">

<script type="text/javascript">        var dojoConfig = { parseOnLoad: true };</script>

<script src="http://js.arcgis.com/3.9/"></script>

新建一个html文件编码

1.       切片服务

ArcGIS Tiled Map Service Layer（切片地图服务图层）提供对由ArcGIS  Server  REST API 所暴露的缓存地图服务资源的访问。缓存服务访问缓存文件夹中预先创建好的切片图片，而不是动态生成图片。

http://localhost:6080/arcgis/rest/services/test/MapServer 为服务地址，根据需要修改

注意需要首先引入esri, 引用这3个文件就可以了

dojo.require("esri.map");

代码如下：

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>地图-Test-切片服务</title>

<linkhref="arcgis_js_v39_api/arcgis_js_api/library/3.9/3.9compact/js/dojo/dijit/themes/tundra/tundra.css"

rel="stylesheet" type="text/css" />

<linkhref="arcgis_js_v39_api/arcgis_js_api/library/3.9/3.9compact/js/esri/css/esri.css"

rel="stylesheet" type="text/css" />

<scriptsrc="arcgis_js_v39_api/arcgis_js_api/library/3.9/3.9compact/init.js" type="text/javascript"></script>

<style type="text/css"> .MapClass { width:900px; height:600px; border:1px solid #000;}</style>

<script type="text/javascript">

dojo.require("esri.map");

dojo.addOnLoad(function () {

var MyMap = new esri.Map("MyMapDiv");

var layer = newesri.layers.ArcGISTiledMapServiceLayer("http://localhost:6080/arcgis/rest/services/test/MapServer");

MyMap.addLayer(layer);

})

</script>

</head>

<body class="tundra">

<div id="MyMapDiv" class="MapClass"></div>

</body>

</html>

运行查看效果

成功了

2.       要素服务

FeatureLayer（要素图层）是在ArcGIS 10.0的时候增加的，是一种特殊的GraphicsLayer，它继承GraphicsLayer，用来对服务图层中的要素服务进行显示，同时还提供了支持表达式过滤，要素的关联查询以及在线编辑等功能。

在ArcGIS API for Javascript中提供了针对要素服务的图层-FeatureLayer，FeatureLayer有很多属性和方法，用于对要素服务实现查询，渲染，编辑等操作。通过设置FeatureLayer的setDefinitionExpression属性，还可以实现对数据的过滤。

要素图层有不同的查询显示模式：快照模式，选择模式，按需模式。还有自动模式esri.layers.FeatureLayer.MODE_AUTO

l 快照模式：就是将地图范围内的数据一次加载进来，当再次移动地图，范围改变的时候，不再向服务器请求；       esri.layers.FeatureLayer.MODE_SNAPSHOT

l 选择模式：需要进行一个选择的操作，用矩形选择工具选择一个范围，就可以看到这个范围的要素已经加载进来了，这个选择与查询可是有区别的。esri.layers.FeatureLayer.MODE_SELECTION

l 按需模式：指的是随着地图范围的改变要素才加载，按照所需的地图范围向服务器请求所要显示的要素。esri.layers.FeatureLayer.MODE_ONDEMAND

注意这里不仅需要引入esri map，还需要引入featurelayer

dojo.require("esri.layers.FeatureLayer");

http:// localhost:6080/arcgis/rest/services/test2/MapServer/52 为发布服务的地址，52表示第53个图层

"spatialReference": { "wkid": '2326'}

Wkid表示Well-known ID ，='2326'表示wgs84坐标系，对照关系可以去esri帮助里找

https://developers.arcgis.com/javascript/jshelp/pcs.html

代码如下：

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>地图-Test-要素服务</title>

<linkhref="arcgis_js_v39_api/arcgis_js_api/library/3.9/3.9compact/js/dojo/dijit/themes/tundra/tundra.css"

rel="stylesheet" type="text/css" />

<linkhref="arcgis_js_v39_api/arcgis_js_api/library/3.9/3.9compact/js/esri/css/esri.css"

rel="stylesheet" type="text/css" />

<scriptsrc="arcgis_js_v39_api/arcgis_js_api/library/3.9/3.9compact/init.js" type="text/javascript"></script>

<style type="text/css"> .MapClass { width:900px; height:600px; border:1px solid #000;}</style>

<script type="text/javascript">

dojo.require("esri.map");

dojo.require("esri.layers.FeatureLayer");

dojo.addOnLoad(function () {

var startExtent = new esri.geometry.Extent({ "xmin": 798496, "ymin": 790000, "xmax": 872050, "ymax": 850000, "spatialReference": { "wkid": '2326'} });

var MyMap =new esri.Map("MyMapDiv", { extent: startExtent });

//定义显示模式

var ftLayer = {

mode: esri.layers.FeatureLayer.MODE_ONDEMAND,

outFields: ["*"]

}

FeatureLayer = new esri.layers.FeatureLayer("http:// localhost:6080/arcgis/rest/services/test2/MapServer/52", ftLayer);

FeatureLayer.isVisible = true;

MyMap.addLayer(FeatureLayer);

})

</script>

</head>

<body class="tundra">

<div id="MyMapDiv" class="MapClass"></div>

</body>

</html>

运行查看效果

ArcGIS Server开发教程系列（7）使用ArcGIS API for Javascript-Hello World的更多相关文章

  1. ArcGIS Server开发教程系列（1） Arcgis server 10.1 的安装

    本系列所使用的软件版本如下: Windows 7 X64 / Windows server 2008 X64 Arcgis for Desktop 10.1 Arcgis 10.1 for serve ...

  2. ArcGIS Server开发教程系列（2）配置ARCMAP和ARCCatalog发布服务

    1.       Arc catalog的配置 打开catalog,如图新增刚刚创建的server 1. Use GIS services: 用户身份连接 使用此种连接,可以浏览.使用站点内发布的所有 ...

  3. ArcGIS Server开发教程系列（3）切片

    切片工作,我们可以一级一级的切,也可以,所有的一块切,Recreate All Tiles这项是说,在没有进行任何的切片工作时,可以选用这项:Recreate Empty Tiles这项是说,如果之前 ...

  4. ArcGIS Server开发教程系列（8）ArcGIS API for Javascript-控件（小部件）

    1.     鹰眼 OverviewMap小部件用于在其关联的主地图内较清楚的当前鸟瞰图的范围.当主地图范围变化时,鹰眼图会自动在其空间内更新范围以保持和地图的当前范围保持一致,当鹰眼图空间的地图范围 ...

  5. ArcGIS Server开发教程系列（8）ArcGIS API for Javascript-控件（小部件）（续）纯代码

    完整代码如下: <html> <head> <meta http-equiv="Content-Type" content="text/ht ...

  6. arcgis engine 开发教程系列

    版权声明:        <ArcGIS Engine+C#实例开发教程>为3SDN(http://www.3sdn.net)原创教程,版权所有.禁止商业用途转载(如需请联系作者),非商业 ...

  7. 【ArcGIS Server 开发系列】Flyingis六大系列讲座精品PDF奉献

    转自:http://www.cnblogs.com/gispeng/archive/2008/07/24/1250116.html [ArcGIS Server 开发系列]Flyingis六大系列讲座 ...

  8. C#开发BIMFACE系列6 服务端API之获取文件信息

    在<C#开发BIMFACE系列4 服务端API之源上传文件>.<C#开发BIMFACE系列5 服务端API之文件直传>两篇文章中详细介绍了如何将本地文件上传到BIMFACE服务 ...

  9. C#开发BIMFACE系列4 服务端API之源上传文件

    在注册成为BIMFACE的应用开发者后,要能在浏览器里浏览你的模型或者获取你模型内的BIM数据, 首先需要把你的模型文件上传到BIMFACE.根据不同场景,BIMFACE提供了丰富的文件相关的接口. ...

随机推荐

  1. hbase伪分布式平台搭建（centos 6.3）

    搭建完<hadoop伪分布式平台>后就开始搭建hbase伪分布式平台了.有了hadoop环境,搭建hbase就变得很容易了. 一.Hbase安装 1.从官网下载最新版本Hbase安装包1. ...

  2. MAC OS X的ACL扩展权限设置

    在WEB开发时,网站是以_www的用户运行的,而我在本地是以liuwencan的用户编辑的.这就带来一个问题:如果所有文件属于liuwencan,那么网站运行需要写文件时就因无权限而失败:如果所有文件 ...

  3. PuTTY配置

    目录 1.作用? 2.中文问题解决 ? 3.GUI支持? 4.使用密钥对实现安全快捷的无密码登陆? 5.操作习惯(Alt+Enter全屏以及字体配置) 6.附录(sshd服务器配置) 1.作用? Pu ...

  4. ANDROID开发中注意不同手机CPU架构对SO文件的不同需求。

    如果没有对应于手机的SO文件,那么在调用第三方SDK时,会经常发生莫明其妙的错误.所以了解你调式或开发的目的手机CPU架构是很有必要的.

  5. [转]一种简单的js时间控件

    使用方法: 粘贴代码到文本文档中,文档名称为datetime.js,然后在html文件中引用如下代码即可 <input name="shijian1" id="sh ...

  6. Window下python2.7+Apache+mod_wsgi+Django服务器配置

    前言:试着使用python搭建一个网页,分别在windows下和linux下,本篇文章主要讲解Window下python+Apache+mod_wsgi+Django服务器配置过程中遇见的问题和解决方 ...

  7. 利用QMP和QEMU虚拟机交互的几种方式

    QMP是一种基于JSON格式的传输协议,我们能利用它与一个QEMU虚拟机实例进行交互,例如查询,更改虚拟机的状态,获取设备信息等等.下面是几种创建QMP的方法以及对其它的一些基本命令的使用: 1.基于 ...

  8. AC日记——I Hate It 洛谷 P1531

    题目背景 很多学校流行一种比较的习惯.老师们很喜欢询问,从某某到某某当中,分数最高的是多少.这让很多学生很反感. 题目描述 不管你喜不喜欢,现在需要你做的是,就是按照老师的要求,写一个程序,模拟老师的 ...

  9. UNITY自带的3D object没有三角形？

    有方形,圆形,圆柱,胶囊,就是没有三角形? 这里看代码如何创建mesh http://www.narkii.com/club/thread-369573-1.html http://www.taikr ...

  10. SSH整合 遇到的头疼的BUGs

    折腾了7个小时,一个项目重新的拷贝.编译.部署.运行.测试,我终于知道了产生问题的所在. 问题一:项目编码没有问题,访问会报404 资源不可用 没有进行重新编译,编译完就好了,可能是拷贝项目的时候,没 ...