在ArcGIS中添加要素图层

问题描述 投票:0回答:1

我正在尝试使用以下代码将客户端要素图形添加到地图中的要素图层,但是地图上似乎什么都没有出现:

    function CreateFeatureLayer()  {
        featureLayer=new FeatureLayer({ 
            source:[],
            objectIdField:"OBJECTID",
            geometryType:"point",
            spatialReference: { wkid: 4326 },
            fields:[ { name:"OBJECTID", type:"oid" }, { name:"name", type:"string" }, { name:"ktypemid", type:"string" }, { name:"kmid", type:"string" }],
            renderer: { type:"simple",  symbol:{ type: "web-style",  styleName: "Esri2DPointSymbolsStyle",  name: "landmark" } },
            popupTemplate: { title: "{Name}"  }
            });

        map.add(featureLayer);

        const data=[{ LATITUDE: 37.6251, LONGITUDE: -119.085, TYPE: "Title",  NAME: "Name" }];

        let graphics=[];
        let i=0,graphic;
        for (i=0;i<data.length;i++) {
            graphic=new Graphic({
                geometry: { type: "point", latitude: data[i].LATITUDE, longitude: data[i].LONGITUDE },
                attributes: data[i]
                });
            graphics.push(graphic);
            }

        app.featureLayer.applyEdits(graphics);
    }

建模示例后,不确定我在做什么错。我还希望能够使用自己的位图,而不是使用ESRI图标。

javascript arcgis-js-api
1个回答
0
投票
我认为您的问题可能是在呼叫applyEdits时出现的。这些功能将带有添加和更新或删除功能和附件的对象作为参数。因此,在您的示例中应该是,

app.featureLayer.applyEdits({addFeatures: graphics});

ArcGIS API - FeatureLayer applyEdits

无论如何,基于我编写此代码的示例之一,它可能会指导您,

<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no" /> <title>FeatureLayer Points Icons - 4.15</title> <style> html, body, #viewDiv { padding: 0; margin: 0; height: 100%; width: 100%; } </style> <link rel="stylesheet" href="https://js.arcgis.com/4.15/esri/themes/light/main.css" /> <script src="https://js.arcgis.com/4.15/"></script> <script> require([ "esri/Map", "esri/views/MapView", "esri/layers/FeatureLayer", "esri/core/promiseUtils", "esri/Graphic", "esri/geometry/Point", ], function( Map, MapView, FeatureLayer, promiseUtils, Graphic, Point ) { function getRandomNumber(min, ref) { return Math.random() * ref + min; } function getGraphics() { const graphics = []; let location = null; // generate 6 random points features for (let i = 0; i <= 5; i++) { location = new Point({ latitude: getRandomNumber(10, 50), longitude: -getRandomNumber(50, 50) }); graphics.push( new Graphic({ geometry: location, attributes: { OBJECTID: i, name: `F${i}` } }) ); } return graphics; } const graphics = getGraphics(); function popupTemplateContent(feature) { const location = feature.graphic.geometry; return `lat:${location.latitude.toFixed(2)} lon:${location.longitude.toFixed(2)}`; } const view = new MapView({ map: new Map({ basemap: "gray-vector" }), container: "viewDiv", zoom: 2, center: [-75, 35] }); view .when() .then(createLayer) .then(addToView) .catch(function(e) { console.error("Creating FeatureLayer failed", e); }); function createLayer() { return new FeatureLayer({ source: graphics, objectIdField: "OBJECTID", fields: [ { name: "OBJECTID", type: "oid" }, { name: "name", type: "string" } ], popupTemplate: { title: '{name}', content: popupTemplateContent }, renderer: { type: "unique-value", field: "OBJECTID", defaultSymbol: { type: "simple-fill" }, uniqueValueInfos: [{ value: "0", symbol: { type: "picture-marker", url: " http://static.arcgis.com/images/Symbols/Cartographic/esriCartographyMarker_98.png", width: "32px", height: "32px" } }, { value: "1", symbol: { type: "picture-marker", url: " http://static.arcgis.com/images/Symbols/Cartographic/esriCartographyMarker_98_Red.png", width: "32px", height: "32px" } }, { value: "2", symbol: { type: "picture-marker", url: " http://static.arcgis.com/images/Symbols/Cartographic/esriCartographyMarker_98_Green.png", width: "32px", height: "32px" } }, { value: "3", symbol: { type: "picture-marker", url: " http://static.arcgis.com/images/Symbols/Cartographic/esriCartographyMarker_98_Blue.png", width: "32px", height: "32px" } }, { value: "4", symbol: { type: "picture-marker", url: " http://static.arcgis.com/images/Symbols/Cartographic/esriCartographyMarker_98_White.png", width: "32px", height: "32px" } }, { value: "5", symbol: { type: "picture-marker", url: " http://static.arcgis.com/images/Symbols/Cartographic/esriCartographyMarker_98_Yellow.png", width: "32px", height: "32px" } }] } }); } function addToView(layer) { view.map.add(layer); } }); </script> </head> <body> <div id="viewDiv"></div> </body> </html>
[最后,在我的评论中,我暂时感到困惑,这就是为什么我问您有关使用FeatureLayer而不是GraphicLayer的原因。我的坏:) ..这是新API的推荐方法。
© www.soinside.com 2019 - 2024. All rights reserved.