I've uploaded GeoJSON to Esri cloud and created a feature layer. Now I'm able to plot the featurelayer into my map. I'm trying to color each feature based on measures which comes from my DB. Here is link to jsfiddle
Let's say we are going to add a measure, i.e., Profit of the state Texas is 100. So I'd like to add {'Profit':100} as a field to the Feature.
Here is the code,
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1,maximum-scale=1,user-scalable=no">
<title>Data-driven continuous color - 4.7</title>
<link rel="stylesheet" href="https://js.arcgis.com/4.7/esri/css/main.css">
<script>
var dojoConfig = {
has: {
"esri-featurelayer-webgl": 1
}
}
</script>
<script src="https://js.arcgis.com/4.7/"></script>
<style>
html,
body,
#viewDiv {
padding: 0;
margin: 0;
height: 100%;
width: 100%;
}
</style>
<script>
require([
"esri/Map",
"esri/views/MapView",
"esri/layers/FeatureLayer",
"esri/widgets/Legend",
"esri/Graphic",
"esri/tasks/support/Query",
"esri/tasks/QueryTask",
"dojo/domReady!"
], function(
Map, MapView, FeatureLayer, Legend, Graphic, Query, QueryTask,
) {
var defaultSym = {
type: "simple-fill", // autocasts as new SimpleFillSymbol()
outline: { // autocasts as new SimpleLineSymbol()
color: "lightgray",
width: 0.5
}
};
var map = new Map({
basemap: "streets"
});
var view = new MapView({
container: "viewDiv",
map: map,
center: [-85.050200, 33.125524],
zoom: 6
});
var openSpacesRenderer = {
"type": "class-breaks",
"field": "CENSUSAREA",
"classBreakInfos": [
{
"symbol": {
"color": [
45,128,120,255
],
"outline": {
"width": 0
},
"type": "simple-fill",
"style": "solid"
},
"label": "0 to 1,629",
"minValue": 0,
"maxValue": 100000
},
{
"symbol": {
"color": [
173,212,106,255
],
"outline": {
"width": 0
},
"type": "simple-fill",
"style": "solid"
},
"label": "> 1,629 to 3,754",
"minValue": 100001,
"maxValue": 200000
},
{
"symbol": {
"color": [
226,235,211,255
],
"outline": {
"width": 0
},
"type": "simple-fill",
"style": "solid"
},
"label": "> 3,754 to 11,438",
"minValue": 200001,
"maxValue": 1000000
}
]
}
var featureLayer = new FeatureLayer({
url: "https://services9.arcgis.com/JPp8avz1ETW9XJJr/arcgis/rest/services/USA_Outline/FeatureServer/0",
outFields: ["*"],
renderer: openSpacesRenderer
});
map.add(featureLayer);
let graphics;
view.when(featureLayer).then(function(layerView) {
//debugger;
layerView.watch("updating", function(value) {
if (!value) { // wait for the layer view to finish updating
// query all the features available for drawing.
layerView.queryFeatures({
geometry: view.extent,
outFields: ["*"],
returnGeometry: true
}).then(function(results) {
for(var r in results){
results[r].attributes['profit']= Math.random()*100
console.log(results[r].attributes);
}
}).catch(function(e) {
console.error("query failed: ", e);
});
}
});
});
});
</script>
</head>
<body>
<div id="viewDiv"></div>
</body>
</html>
Now in the for loop I'm trying to add a attribute profit with what we have. Then if I change field variable of openSpacesRenderer as profit, it is not working. How can I add a new field to the existing feature layer?
2 Answers 2
Use the featureLayer's method applyEdits
EDIT: The applyEdits method is used to apply updates/additions and data deletion to a FeatureLayer. From the link above: If client-side features are added, removed or updated at runtime using applyEdits() then use queryFeatures() to return updated features.
You can use Arcade expressions to calculatenew (temporary) fields, and then use them for popups and/or labeling.
https://developers.arcgis.com/javascript/latest/guide/arcade/index.html https://developers.arcgis.com/javascript/latest/sample-code/index.html?search=arcade
-
1I think your answer would better if it included some sample code to do this rather than just links to where that might be found.2020年06月10日 00:52:30 +00:00Commented Jun 10, 2020 at 0:52
Explore related questions
See similar questions with these tags.