arcgis 添加要素并获取objectId

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>WebGIS</title>
    <link rel="stylesheet" type="text/css" href="http://10.20.3.127/arcgis_js_api/library/3.32/dijit/themes/tundra/tundra.css" />
    <link rel="stylesheet" href="  http://10.20.3.127/arcgis_js_api/library/3.32/esri/css/esri.css" />
    <script type="text/Javascript" src="http://10.20.3.127/arcgis_js_api/library/3.32/init.js"></script>


    <style type="text/css">
        .MapClass {
            width: 100%;
            height: 500px;
            border: 1px solid #000;
        }
    </style>
    <script type="text/javascript">

        require(["esri/map",
            "dojo/on",
            "dojo/query",
            "esri/layers/ArcGISDynamicMapServiceLayer",
            "esri/toolbars/draw",
            "esri/layers/FeatureLayer",
            "esri/graphic", "esri/dijit/editing/Add",
            "esri/dijit/editing/Delete", "esri/dijit/editing/Update", "esri/tasks/query", "dojo/json",
            "dojo/domReady!"],
            function (Map, on, query, ArcGISDynamicMapServiceLayer, Draw, FeatureLayer, Graphic, Add, Delete, Update, Query, jsonUtil) {


                var map = new esri.Map("MyMapDiv");
                var layer = new ArcGISDynamicMapServiceLayer("http://localhost:6080/arcgis/rest/services/HBKYQ/Test001/MapServer");
                map.addLayer(layer);
                //用于操作的要素图层,注意我们是操作的宿舍楼图层
                var featureLayer = new FeatureLayer("http://localhost:6080/arcgis/rest/services/HBKYQ/Test001/FeatureServer/1",
                    {
                        mode: FeatureLayer.MODE_SNAPSHOT,
                        outFields: ["*"]
                    });
                //在添加要素时,利用Draw工具获得geometry对象
                var d = new Draw(map, { showTooltips: true });
                //要操作的graphic
                var g;
                var btns = query("button");
                on(btns, "click", function (event) {
/*                query("button").on("click", function (event) {*/
                    var value = this.innerHTML;
                    switch (value) {
                        case "添加要素":
                            d.activate(Draw.POLYGON);
                            break;
                        case "删除要素":
                            //创建Graphic对象,删除OBJECTID为34的元素,
                            //因为OBJECTID是主键,所以只需要指定主键即可
                            g = new Graphic("", "", {
                                "OBJECTID": 34
                            });
                            //创建删除对象
                            var de = new Delete({
                                "featureLayer": featureLayer,
                                "deletedGraphics": [g]
                            });
                            //执行删除结果
                            de.performRedo();
                            //刷新图层
                            layer.refresh();
                            break;
                        case "修改要素":
                            //用于修改要素的函数,查询更新为36的要素
                            updateFeature(1);
                            break;
                        case "查询要素":
                            //用于查询要素的函数,查询主键为36的要素
                            searchFeather(1);
                            break;
                    }
                });
                //当画图完毕时,添加要素
                on(d, "draw-complete", function (result) {

                    ////要素只赋予了geometry,属性信息为空  添加方法一
                    //var attr = { "Id": 1, "name": "Name", "alias": "Mesa Mint" };
                    ///*var graphic = new Graphic(result.geometry, null, attr);*/
     //               var graphic = new Graphic(result.geometry, null, attr);
                    //var add = new Add({
                    //    "featureLayer": featureLayer,//给哪一个要素图层添加要素
                    //    "addedGraphics": [graphic]//用于添加的要素
                    //})
                    ////执行添加函数
                    //add.performRedo();
                    ////刷新视图
                    //layer.refresh();
                    ////关闭绘图对象
                    //d.deactivate();

            //添加方法二
                    var attr = { "Id": 2, "name": "Name", "alias": "Mesa Mint" };
                    var graphic = new Graphic(result.geometry, null, attr);        
                    //applyEdits(adds?, updates?, deletes?, callback?, errback?)
                    featureLayer.applyEdits([graphic], null, null, callback, errback)

                    layer.refresh();
                    //关闭绘图对象
                    d.deactivate();

                });

                function callback(info) {
                    featureLayer.refresh();
                    layer.refresh();
                    alert("成功!");
                    alert(info[0].objectId);
                    console.log(info);
                }

                function errback(error) {
                    console.log('failed');
                }
                //根据id修改要素
                function updateFeature(id) {
                    //注意:(第二个参数)这里传入一个回调函数,用于处理查询出来的数据
                    searchFeather(id, function (result) {
                        //获得旧的要素
                        var oldgraphic = result[0];
                        //新的要素
                        var newgraphic = new Graphic(oldgraphic.toJson());
                        //将alias属性修改为:修改后的A区宿舍
                        newgraphic.attributes.alias = "修改后的A区宿舍";
                        //创建更新对象
                        var update = new Update({
                            "featureLayer": featureLayer,
                            "postUpdatedGraphics": [newgraphic],//修改之后的要素
                            "preUpdatedGraphics": [oldgraphic]//修改之前的要素
                        })
                        //执行刷新操作
                        update.performRedo();
                        //刷新视图
                        layer.refresh();
                        alert("修改成功");

                    })

                }
                //根据id查询要素
                function searchFeather(id, callback) {
                    //得到要素图层的主键属性
                    var idProperty = featureLayer.objectIdField;
                    //定义查询参数
                    var query = new Query();
                    //是否返回几何形状
                    query.returnGeometry = false;
                    //图层的主键名称(根据自己要求修改)
                    query.objectIds = [id];
                    //查询条件1=1意思是:只根据主键查询,忽略where子句
                    query.where = "1=1";
                    //进行查询
                    featureLayer.selectFeatures(query, FeatureLayer.SELECTION_NEW, function (result) {
                        //如果callback不存在,说明仅仅是查询操作
                        if (!callback) {
                            //因为我们根据主键查询,一定只有一个元素
                            var graphic = result[0];
                            //获得属性
                            var attributes = graphic.attributes;
                            //得到该属性信息转换成字符串
                            var result = jsonUtil.stringify(attributes)
                            //将结果弹出一下
                            alert(result);
                        } else//如果callback存在,说明是更新操作
                        {
                            callback(result);
                        }

                    });
                }
            });


    </script>
</head>
<body>
<div id="MyMapDiv" class="MapClass"></div>
<button class="btn">添加要素</button>
<button class="btn">删除要素</button>
<button class="btn">修改要素</button>
<button class="btn">查询要素</button>
</body>
</html>

 

posted @ 2024-08-21 17:00  恋上微笑的天使  阅读(15)  评论(0编辑  收藏  举报