ArcGIS JS 实现前端添加shape并保存到服务器

来源：互联网发布：windows ce应用小游戏编辑：程序博客网时间：2024/06/16 12:48

步骤：

1.在服务器上准备一个工作空间进行存放上传的shape文件
2.设置arcgis server ,将地图服务设置为允许动态加载shape文件
3.注册工作文件夹
4.代码加载，并显示保存

详细步骤：

1.准备一个工作空间存放上传的shape文件

我这里就采用了d盘中的test文件夹作为存储空间，实际目录：D:\图层\test

2.设置服务器中的目标服务为动态服务

找到服务下功能页面，在默认地图下，勾选动态工作空间，此处我已经勾选了，然后点击添加，会弹出如下界面：

工作空间id自己随便取，不过建议就采用存储空间的名字，便于记忆

位置为存储空间在本地的目录位置，上面已经提到过了，填写完毕后点击添加，回退到上一界面，点击右上角的保存并重新启动

3.注册工作文件夹

注意上图中我圈起来的四个地方，界面切换到站点，数据存储界面下，会出现界面显示已注册数据库和注册的文件夹

关于如何注册arcgis server 与注册数据库托管服务，请参考这边博客：http://blog.csdn.net/kangkang_style/article/details/73181051

此处我就不再赘述了

点击注册文件夹，弹出界面如下：

名称为存储空间注册文件夹名称，和刚才添加的名称一致

发布文件夹路径最开是的时候已经写过了，即存储空间的地址

发布者主机本机的话直接localhost

服务器文件夹直接勾选与发布者文件夹相同即可

4.找到目标url即可拿来使用了

在显示页面的最下方

4.下面是代码的实现部分：

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>ShapeFile</title><link rel="stylesheet" href="http://js.arcgis.com/3.9/js/esri/css/esri.css">  <script src="http://js.arcgis.com/3.9/"></script>   <script type="text/javascript"> //服务地图 var serviceUrl="http://localhost:6080/arcgis/rest/services/MyMapService/MapServer"; //动态图 var dynamicUrl="http://localhost:6080/arcgis/rest/services/MyMapService/MapServer/dynamicLayer"; //线要素 var featureUrl="http://localhost:6080/arcgis/rest/services/%E8%A7%86%E9%A2%91%E6%95%99%E5%AD%A66/FeatureServer/1"; //几何图形数组 var graValues=[]; //符号 var lineSymbol; require([ "esri/map",                            "dojo/dom",                            "dojo/on",                            "esri/layers/ArcGISDynamicMapServiceLayer",                            "esri/layers/FeatureLayer",                            "esri/layers/TableDataSource",                           "esri/layers/LayerDataSource",                            "esri/renderers/SimpleRenderer",                           "esri/symbols/SimpleMarkerSymbol",                            "esri/symbols/SimpleLineSymbol",                            "esri/toolbars/draw",                            "esri/graphic",                           "dojo/domReady!"         ],function( Map, dom, on,  ArcGISDynamicMapServiceLayer, FeatureLayer,  TableDataSource, LayerDataSource,  SimpleRenderer,  SimpleMarkerSymbol, SimpleLineSymbol, Draw, Graphic   ){ var map=new Map("map"); var layer=new ArcGISDynamicMapServiceLayer(serviceUrl); layer.setDisableClientCaching(true);  map.addLayer(layer);    //添加shape--featureLayer on(dom.byId("btn"),"click",function(e){                                //定义一个数据源                                var dataSource = new TableDataSource();                                //此处为我们设置的命名空间                                dataSource.workspaceId = "test";                                //命名空间下面的shp                                dataSource.dataSourceName = "经纬网.shp";                                //定义一个图层数据源                                var layerSource = new LayerDataSource();                                //给图层数据源赋值                                layerSource.dataSource = dataSource;                                //定义一个要素图层:注意链接为动态图层的地址                                var layer2 = new FeatureLayer(dynamicUrl, {                                    mode: FeatureLayer.MODE_ONDEMAND,                                    outFields: ["*"],                                    source: layerSource                                });                                //定义线符号                                lineSymbol = new SimpleLineSymbol(SimpleLineSymbol.STYLE_DASH, new dojo.Color([255, 0, 0]), 3);                                //定义渲染器                                var renderer = new esri.renderer.SimpleRenderer(lineSymbol);                                //定义渲染器                                layer2.setRenderer(renderer);                                layer2.refresh();                                layer2.id="layer2";                                //将添加shape显示在地图上，此时还未保存于服务器                                map.addLayer(layer2);                                //获取添加shape中的所有图形                                graValues=map.getLayer("layer2").graphics;                  });              //提交到服务器保存         on(dom.byId("add"),"click",function(evt){   var layer3=new FeatureLayer(featureUrl,{         outFields:["*"],           });    layer3.applyEdits(graValues,null,null);  });           });</script></head><body><input id="btn" type="button" value="AddDynamicLayer" /><input id="add" type="button" value="AddConfirm" /><div id="map"></div></body></html>

各位小伙伴觉得还行的话留个言点个攒吧

阅读全文

0 0