I am trying to make a unique value renderer on a map using the JavaScript API. I am using a layer that represents continents. I have used the samples and modified the code for my own layer, but I can not get the feature layer to populate or the renderer to work. I have changed 'Continent' to 'CONTINENT' and 'continent' in the script but it does not matter. The layer does not populate and therefor it does not generate the unique value renderer. The developer tools and inspect tool in Chrome does not throw me any errors. I am using these resources:
http://services.arcgis.com/BG6nSlhZSAWtExvp/arcgis/rest/services/Continents_simple/FeatureServer https://developers.arcgis.com/javascript/3/jssamples/renderer_unique_value.html
Here is my code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-
scalable=no">
<title>Unique Value Renderer</title>
<link rel="stylesheet" href="https://js.arcgis.com/3.22/esri/css/esri.css">
<style>
html, body, #map{
height: 100%;
margin: 0;
padding: 0;
}
</style>
<script src="https://js.arcgis.com/3.22/"></script>
<script>
var map;
require([
"esri/map", "esri/layers/FeatureLayer", "esri/InfoTemplate",
"esri/symbols/SimpleLineSymbol", "esri/symbols/SimpleFillSymbol",
"esri/renderers/UniqueValueRenderer", "esri/Color",
"dojo/domReady!"
], function(
Map, FeatureLayer, InfoTemplate,
SimpleLineSymbol, SimpleFillSymbol,
UniqueValueRenderer, Color
) {
map = new Map("map", {
basemap: "streets",
center: [-95.625, 39.243],
zoom: 1,
slider: false
});
map.on("load", addFeatureLayer);
function addFeatureLayer() {
var defaultSymbol = new
SimpleFillSymbol().setStyle(SimpleFillSymbol.STYLE_NULL);
defaultSymbol.outline.setStyle(SimpleLineSymbol.STYLE_NULL);
//create renderer
var renderer = new UniqueValueRenderer(defaultSymbol, "Continent");
//add symbol for each possible value
renderer.addValue("North America", new SimpleFillSymbol().setColor(new Color([255, 0, 0, 0.5])));
renderer.addValue("Africa", new SimpleFillSymbol().setColor(new Color([0, 255, 0, 0.5])));
renderer.addValue("Asia", new SimpleFillSymbol().setColor(new Color([0, 0, 255, 0.5])));
renderer.addValue("Europe", new SimpleFillSymbol().setColor(new Color([255, 0, 255, 0.5])));
renderer.addValue("Oceania", new SimpleFillSymbol().setColor(new Color([255, 255, 255, 0.75])));
renderer.addValue("South America", new SimpleFillSymbol().setColor(new Color([0, 255, 255, 0.5])));
renderer.addValue("Antarctica", new SimpleFillSymbol().setColor(new Color([255, 255, 0, 0.5])));
renderer.addValue("Australia", new SimpleFillSymbol().setColor(new Color([127, 127, 127, 0.5])));
var featureLayer = new FeatureLayer("http://services.arcgis.com/BG6nSlhZSAWtExvp/arcgis/rest/services/Continents_simple/FeatureServer", {
infoTemplate: new InfoTemplate(" ", "${Continent}"),
mode: FeatureLayer.MODE_ONDEMAND,
outFields: ["Continent"]
});
featureLayer.setRenderer(renderer);
map.addLayer(featureLayer);
}
});
</script>
</head>
<body>
<div id="map"></div>
</body>
</html>
1 Answer 1
I fixed this by changing the source url for the layer to http://services.arcgis.com/BG6nSlhZSAWtExvp/ArcGIS/rest/services/Continents_simple/FeatureServer/0
When I posted the link above I went inside it and it was the REST directory (which I was not originally in, I was just in ArcGIS Online 'My Map') and I saw that there was an actual layer inside the service. Once I clicked on that, it was clear that I needed to choose the layer '0' that was inside the FeatureServer.
-
Exactly, the render was right implemented, the problem was that you were not able to get the Feature Layer form the server.Katah– Katah2017年11月06日 09:50:12 +00:00Commented Nov 6, 2017 at 9:50
Explore related questions
See similar questions with these tags.