Hi all,
Robert Scheitlin, GISP, Ken Buja
I have web map with editable featureLayer. After click on my feature i get atrributes (using hitTest), and after click button "Query" query result displays as graphicsLayer and after another click graphic adds to graphicLayer. Idea of doing that is to merge several features in to one feature and update featreLayer after click on button.
Now after click button "Update" i want to update graphicLayer features in my featureLayer, but it does not update.
I paste full code to show how it is done:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>GWP - მილი და სამისამართო ერთეული</title>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<link rel="stylesheet" href="https://js.arcgis.com/4.14/esri/css/main.css">
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.1/themes/smoothness/jquery-ui.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.12.1/jquery-ui.min.js"></script>
<script src="https://js.arcgis.com/4.14"></script>
<script>
require([
"esri/Map",
"esri/widgets/ScaleBar",
"esri/widgets/Home",
"esri/widgets/Compass",
"esri/widgets/BasemapToggle",
"esri/symbols/SimpleMarkerSymbol",
"esri/symbols/SimpleFillSymbol",
"esri/symbols/SimpleLineSymbol",
"esri/renderers/UniqueValueRenderer",
"esri/tasks/QueryTask",
"esri/tasks/support/Query",
"esri/widgets/BasemapToggle",
"esri/widgets/DistanceMeasurement2D",
"esri/widgets/AreaMeasurement2D",
"esri/widgets/ScaleBar",
"esri/widgets/Home",
"esri/widgets/Compass",
"esri/views/MapView",
"esri/widgets/Legend",
"esri/widgets/Expand",
"esri/layers/GroupLayer",
"esri/layers/MapImageLayer",
"esri/widgets/LayerList",
"esri/layers/FeatureLayer",
"esri/layers/GraphicsLayer",
"esri/widgets/Expand",
"esri/widgets/Sketch/SketchViewModel",
"esri/widgets/FeatureForm",
"esri/widgets/FeatureTemplates",
"esri/geometry/geometryEngine",
"esri/Graphic",
"dojo/on",
"dojo/dom",
"dojo/dom-construct",
"dojo/domReady!"
], function(
Map, ScaleBar, Home, Compass, BasemapToggle, SimpleMarkerSymbol, SimpleFillSymbol, SimpleLineSymbol, UniqueValueRenderer, QueryTask, Query, BasemapToggle, DistanceMeasurement2D,
AreaMeasurement2D, ScaleBar, Home, Compass, MapView,Legend, Expand, GroupLayer, MapImageLayer,
LayerList,
FeatureLayer,
GraphicsLayer,
Expand,
SketchViewModel,
FeatureForm,
FeatureTemplates,
geometryEngine,
Graphic,
on, dom, domConstruct
) {
let editFeature, highlight;
var fLpolygonSymbol = {
type: "simple-fill",
color: "yellow",
style: "solid",
outline: {
color: "red",
width: 1
}
};
const featureLayer = new FeatureLayer({
url:
"http://localhost:6080/arcgis/rest/services/test/Request_Area/FeatureServer/0",
title:"",
outFields: ["*"],
popupEnabled: false,
id: "incidentsLayer",
listMode: "hide",
legendEnabled: false
});
const graphicsLayer = new GraphicsLayer({
id: "tempGraphics",
listMode: "hide"
});
const labelClass = {
symbol: {
type: "text",
color: "black",
haloColor: "black",
font: {
family: "sans-serif",
size: 8,
weight: "bold"
}
},
labelPlacement: "center-along",
labelExpressionInfo: {
expression: "$feature.g_dasaxeleba_ka"
}
};
var renderer = {
type: "simple",
symbol: {
type: "simple-fill",
style: "none",
outline: {
color: "grey",
width: 0.5
}
}
};
layer2popup = {
title: "ქუჩა",
content: [{
type: "fields",
fieldInfos: [{
fieldName: "g_dasaxeleba_ka",
label: "ქუჩის დასახელება",
visible: true
},{
fieldName: "SE_ID_new",
label: "SE ID new",
visible: true
},
{
fieldName: "zd_donis_ID",
label: "ზედა ზონის ID",
visible: true
}]
}]
}
var layer2 = new FeatureLayer({
url: "http://localhost:6080/arcgis/rest/services/test/Tbilisi_wyalmomarageba_vaxo/MapServer/15",
title: "სამისამართო ერთეული",
popupTemplate: layer2popup,
popupEnabled: false,
outFields: ["*"],
labelingInfo: [labelClass],
renderer: renderer
});
var HWUrl = "http://10.0.251.179:6080/arcgis/rest/services/test/Tbilisi_wyalmomarageba_vaxo/MapServer/15";
var HWLayer = new FeatureLayer({
url: HWUrl,
outFields: ["*"],
visible: false
});
var map = new Map({
basemap: "osm",
layers: [layer2, featureLayer, graphicsLayer]
});
var view = new MapView({
container: "viewDiv",
map: map,
center: [44.7502, 41.725524],
zoom: 12,
highlightOptions: {
color: "red"
}
});
view.on("double-click", function(evt) {
evt.stopPropagation();
console.info(evt);
});
var toggle = new BasemapToggle({
titleVisible: true,
view: view,
nextBasemap: "satellite"
});
view.ui.add(toggle, "top-left");
view.on("click", function (event) {
view.hitTest(event).then(function (response) {
if (response.results.length) {
var graphic = response.results.filter(function (result) {
return result.graphic.layer === layer2;
})[0].graphic;
var attributes = graphic.attributes;
var name = attributes.g_dasaxeleba_ka;
var SE_ID = attributes.SE_ID_new;
}
var queryZebna = dom.byId("query-Zebna");
on(queryZebna, "click", function() {
queryMagistraluri()
.then(displayResults);
});
function queryMagistraluri() {
var query = HWLayer.createQuery();
query.where = "g_dasaxeleba_ka LIKE N'%"+ name +"%'";
query.outSpatialReference = view.spatialReference;
return HWLayer.queryFeatures(query)
}
function displayResults(results) {
console.log(results);
var pfeatures = results.features.map(function(graphica) {
graphica.symbol = {
type: "simple-fill",
color: "orange",
style: "solid",
outline: {
color: "black",
width: 1
}
};
return graphica
});
graphicsLayer.addMany(pfeatures);
view.goTo(pfeatures)
}
});
});
const btnupdate = dom.byId("button-update");
on(btnupdate, "click", function () {
function addGraphic(event) {
const graphic = new Graphic({
geometry: polygon,
symbol: graphica.symbol,
attributes: {}
});
graphicsLayer.add(graphic);
const edits = {
addFeatures: [graphic]
};
applyEdits(edits);
console.log(graphic);
};
function applyEdits(params) {
featureLayer.applyEdits(params).then(function(editsResult) {
if (editsResult.addFeatureResults.length > 0) {
const objectId = editsResult.addFeatureResults[0].objectId;
}
})
.catch(function(error) {
console.log("===============================================");
console.error("[ applyEdits ] FAILURE: ", error.code, error.name,
error.message);
console.log("error = ", error);
});
}
})
});
</script>
</head>
<body>
<button id="query-Zebna">ძებნა</button>
<button id="button-update">Update</button>
<div id="viewDiv"></div>
</div>
</body>
</html>