I have a feature service I'm trying to symbolize in a web map. There are over 2,000 features in the service, but I'm using a field with a little over 200 categories for the symbology. I don't need a separate color for each of the 200 values - maybe 20 or so colors would be sufficient. Problem is, I don't want to have to create a renderer with 200 different symbologies, I would prefer to create a renderer with 20 different symbologies and use each for 10 different values. I was trying to do something like the following, but it wasn't working:
var subdivisionRen = {
type: "unique-value",
field: "Book",
defaultSymbol: { type: "simple-fill" },
uniqueValueInfos: [{
value: ["1853", "1863", "1873", "1883", "1893", "1903", "1913", "1923", "1933"],
symbol: {
type: "simple-fill",
color: "blue"
}
}, {
value: ["1854", "1864", "1874", "1884", "1894", "1904", "1914", "1924", "1934"],
symbol: {
type: "simple-fill",
color: "green"
}
}, {
value: ["1855", "1865", "1875", "1885", "1895", "1905", "1915", "1925", "1935"],
symbol: {
type: "simple-fill",
color: "red"
}
}, {
value: ["1856", "1866", "1876", "1886", "1896", "1906", "1916", "1926", "1936"],
symbol: {
type: "simple-fill",
color: "yellow"
}
}]
};
And so on, with 20 symbols containing 10 values each. I don't know if it's not possible to have a list for value, or if it is, if I have the syntax wrong, or what. But if anyone has any suggestions I'm all ears.
Solved! Go to Solution.
Hello John,
You can use an Arcade Expression for the 'valueExpression' property of the UniqueValueRenderer. Here is some sample code of an example using state names. I only added a few, but you can get the idea with just a few states. You can use the When logical operation in Arcade to add as many expressions until one evaluates to true. So, you can have certain values return a specific integer or string, and then use the uniqueValueInfos, to apply the symbol you like, based off what the values you choose to return.
const name = "$feature.state_name";
const uvr = {
type: "unique-value",
valueExpression: `When(${name} == 'Hawaii', 0, ${name} == 'Washington', 0, ${name} == 'Montana', 0, ${name} == 'North Dakota', 0, ${name} == 'South Dakota', 1, ${name} == 'Wyoming', 1, ${name} == 'Wisconsin', 1, ${name} == 'Oregon', 2, ${name} == 'Texas', 2, ${name} == 'Florida', 2, 3)`, // when([expr1, result1, ...exprN, resultN], default)
uniqueValueInfos: [
{
value: "0",
symbol: sym0
}, {
value: "1",
symbol: sym1
},{
value: "2",
symbol: sym2
}, {
value: "3",
symbol: sym3
}]
};
var featureLayer = new FeatureLayer({
url:"https://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer/2",
renderer: uvr
});
Sample application:
https://codepen.io/banuelosj/pen/OJMOMXw
Regards,
Jose
Hi John
There might be an easier way to do this, by adding the layer to a web map in Portal or ArcGIS Online, then use the out of the box features in the map viewer to change the layer symbology, this will be from the "Change Style" panel. Once the layer is saved in a web map, then you can use the web map in your application without the need the handcraft the symbology.
I hope this would help
Regards
Ihab
Thanks. Yes, I'm aware you can do that, but we were wanting the symbology to be made on the client side, which is why I'm trying to do it here instead of in Portal.
Hello John,
You can use an Arcade Expression for the 'valueExpression' property of the UniqueValueRenderer. Here is some sample code of an example using state names. I only added a few, but you can get the idea with just a few states. You can use the When logical operation in Arcade to add as many expressions until one evaluates to true. So, you can have certain values return a specific integer or string, and then use the uniqueValueInfos, to apply the symbol you like, based off what the values you choose to return.
const name = "$feature.state_name";
const uvr = {
type: "unique-value",
valueExpression: `When(${name} == 'Hawaii', 0, ${name} == 'Washington', 0, ${name} == 'Montana', 0, ${name} == 'North Dakota', 0, ${name} == 'South Dakota', 1, ${name} == 'Wyoming', 1, ${name} == 'Wisconsin', 1, ${name} == 'Oregon', 2, ${name} == 'Texas', 2, ${name} == 'Florida', 2, 3)`, // when([expr1, result1, ...exprN, resultN], default)
uniqueValueInfos: [
{
value: "0",
symbol: sym0
}, {
value: "1",
symbol: sym1
},{
value: "2",
symbol: sym2
}, {
value: "3",
symbol: sym3
}]
};
var featureLayer = new FeatureLayer({
url:"https://sampleserver6.arcgisonline.com/arcgis/rest/services/USA/MapServer/2",
renderer: uvr
});
Sample application:
https://codepen.io/banuelosj/pen/OJMOMXw
Regards,
Jose
Thanks, that was less than ideal, but good enough. I ended up grabbing the last digit of my Book field. Like this:
valueExpression: `When(${Book}[3] == '0', 0, ${Book}[3] == '1', 1, 0)' //and so on
And then making 10 color/symbol categories instead of 20.
Hi Jose,
Realize this post is a long time ago. I'm trying to duplicate what I've done in a WPF app using Esri.ArcGISRuntime.WPF. I have an address layer that i need to symbolize by different values in multiple fields. I create queries and select by the desired fields. Then i add each point as a graphic with the desired symbology.
I'm hoping that i can use Arcade to set symbols for addresses based on different fields. I'm going to try this but I thought I'd reach out to see if there is a better way.