Select to view content in your preferred language

Issue with using Unique value groups with field and field1

624
5
Jump to solution
05-19-2023 11:58 AM
LayEngTan
New Contributor

Hi, I would like to find out is using Unique Value Groups, with "field" and "field2", still support putting list of values in the values field?

It is working fine when using it with just one "field" (highlighted in green), but it does not work when "field2" is added into the conditions (highlighted in red).

const renderer = {
type: "unique-value",
field: "test1",
uniqueValueGroups: [{
heading: "Heading 1",
classes: [{
label: "Label 1",
symbol: {
type: "simple-marker",
style: "circle",
color: "#58ff60",
outline: {
color: "rgba(140,255,120,0.5)",
width: 6
}
},
values: ["testValue", "testValue1"]
}, {
label: "Label 2",
symbol: {
type: "simple-marker",
style: "circle",
color: "#58ff60",
outline: {
color: "rgba(140,255,120,0.5)",
width: 6
}
},
values: "testValue3"
}]
}]
}

const renderer = {
type: "unique-value",
field: "test1",
field2: "test2",
uniqueValueGroups: [{
heading: "Heading 1",
classes: [{
label: "Label 1",
symbol: {
type: "simple-marker",
style: "circle",
color: "#58ff60",
outline: {
color: "rgba(140,255,120,0.5)",
width: 6
}
},
values: {
value: ["testValue", "testValue1"],
value2: "testValve2"
}
}, {
label: "Label 2",
symbol: {
type: "simple-marker",
style: "circle",
color: "#58ff60",
outline: {
color: "rgba(140,255,120,0.5)",
width: 6
}
},
values: {
value: "testValue3",
value2: "testValve4"
}
}]
}]
}

 

0 Kudos
1 Solution

Accepted Solutions
LayEngTan
New Contributor

Hi KristianEkenes,

Thank you for the solutions. However, when using field and field2 together, each single object need to have both value and value2. I have tested it and it worked. Thank you.

Here is the working version (highlighted in green).

const renderer = {
type: "unique-value",
field: "test1",
field2: "test2",
uniqueValueGroups: [{
heading: "Heading 1",
classes: [{
label: "Label 1",
symbol: {
type: "simple-marker",
style: "circle",
color: "#58ff60",
outline: {
color: "rgba(140,255,120,0.5)",
width: 6
}
},
values: [{
value: "testValue",
value2: "testValve2"
}, {

value: "testValue1",
value2: "testValve2"
}

]
}, {
label: "Label 2",
symbol: {
type: "simple-marker",
style: "circle",
color: "#58ff60",
outline: {
color: "rgba(140,255,120,0.5)",
width: 6
}
},
values: {
value: "testValue3",
value2: "testValve4"
}
}
]
}
]
}

 

View solution in original post

0 Kudos
5 Replies
KristianEkenes
Esri Regular Contributor

The first scenario works because passing an array of strings to the values property is a convenience pattern when you're only working with one value. The second example is using incorrect syntax. You can't pass an array to values.value or values.value2. The values property takes an array of objects, like this... That way you can pair up values that go together in a 

 

const renderer = {
    type: "unique-value",
    field: "test1",
    field2: "test2",
    uniqueValueGroups: [{
        heading: "Heading 1",
        classes: [{
            label: "Label 1",
            symbol: {
                type: "simple-marker",
                style: "circle",
                color: "#58ff60",
                outline: {
                    color: "rgba(140,255,120,0.5)",
                    width: 6
                }
            },
            values: [{
                value: "testValue"
            }, {
                value: "testValue1",
            }, {
                value2: "testValve2"
            }]
        }, {
            label: "Label 2",
            symbol: {
                type: "simple-marker",
                style: "circle",
                color: "#58ff60",
                outline: {
                    color: "rgba(140,255,120,0.5)",
                    width: 6
                }
            },
            values: {
                value: "testValue3",
                value2: "testValve4"
            }
        }]
    }]
}

 

Or if you want field1 and field2 values combined to represent one category, you specify the values for each within a single object.

 

values: [{
  value: "testValu1",
  value2: "testValue2"
}, {
  value: "testValue3",
}, {
  value2: "testValve4"
}]
0 Kudos
LayEngTan
New Contributor

Hi KristianEkenes,

Thank you for the solutions. However, when using field and field2 together, each single object need to have both value and value2. I have tested it and it worked. Thank you.

Here is the working version (highlighted in green).

const renderer = {
type: "unique-value",
field: "test1",
field2: "test2",
uniqueValueGroups: [{
heading: "Heading 1",
classes: [{
label: "Label 1",
symbol: {
type: "simple-marker",
style: "circle",
color: "#58ff60",
outline: {
color: "rgba(140,255,120,0.5)",
width: 6
}
},
values: [{
value: "testValue",
value2: "testValve2"
}, {

value: "testValue1",
value2: "testValve2"
}

]
}, {
label: "Label 2",
symbol: {
type: "simple-marker",
style: "circle",
color: "#58ff60",
outline: {
color: "rgba(140,255,120,0.5)",
width: 6
}
},
values: {
value: "testValue3",
value2: "testValve4"
}
}
]
}
]
}

 

0 Kudos
JoelBennett
MVP Regular Contributor

If anyone is looking to create a multi-field UniqueValueRenderer via rendererJsonUtils.fromJSON or UniqueValueRenderer.fromJSON, the still undocumented JSON structure for specifying it with uniqueValueGroups has the corresponding structure below:

{
	"type": "uniqueValue",
	"field1": "test1",
	"field2": "test2",
	"uniqueValueGroups": [{
		"heading": "Heading 1",
		"classes": [{
			"label": "Label 1",
			"symbol": {
				"type": "esriSMS",
				"style": "esriSMSCircle",
				"color": [88,255,96,255],
				"outline": {
					"color": [140,255,120,128],
					"width": 6
				}
			},
			"values": [
				["testValue","testValue2"],
				["testValue1","testValue2"]
			]
		}, {
			"label": "Label 2",
			"symbol": {
				"type": "esriSMS",
				"style": "esriSMSCircle",
				"color": [88,255,96,255],
				"outline": {
					"color": [140,255,120,128],
					"width": 6
				}
			},
			"values": [
				["testValue3","testValue4"]
			]
		}]
	}]
}

 

Note that the "values" property must be specified as an Array of arrays.

0 Kudos
KristianEkenes
Esri Regular Contributor

the still undocumented JSON structure for specifying it with uniqueValueGroups

The JSON structure has actually been documented in the web map specification ever since the concept was introduced. You can find it here: 

https://developers.arcgis.com/web-map-specification/objects/uniqueValueRenderer/
https://developers.arcgis.com/web-map-specification/objects/uniqueValueGroup/
https://developers.arcgis.com/web-map-specification/objects/uniqueValueClass/

It includes examples with multiple scenarios. Perhaps we should improve the JS documentation to link to the web map specification.

0 Kudos
JoelBennett
MVP Regular Contributor

Thank you, I stand corrected.

0 Kudos