Flags
Last updated
Last updated
Flags are a data-driven decoration created specifically for multi-pick fields (fields like Tags that can hold more than one value). When you decorate elements with flags, Kumu draws colored arcs around the outside of those elements. Each flag represents one of the possible values in the multi-pick field.
If you're using the Color by tool in the Basic Editor, and you select a multi-pick field, Kumu will automatically use flags to color code your elements.
Is the Color by tool applying flags for a field that isn't a multi-pick field? Try changing the field's limit to "One" instead of "One or more".
In the Advanced Editor, you can use the flags property to add flags. Here's the basic syntax:
You can replace element with any element selector, Field with any multi-pick field, and colorPalette with any palette from our color reference. To further customize the flags' appearance, you can use the flag-size property to control the thickness of the flags, and the flag-offset property to control the distance between the flags and their element.
You can also activate flags using the @settings block, like so:
The advantage of using @settings to apply flags is that all of your colors and the corresponding field values will be added to your map's legend.
The downside of using @settings to apply flags is that the decoration will always be applied to all the elements on your map—which might not always be desirable! But, it's easy to turn off flags for certain elements using flag: none, like so:
This code uses the @settings block to add flags to all elements, then, taking advantage of Kumu's cascade rules, it uses flag: none to turn off flags for a smaller selection of elements.
You can also manually assign colors to values if you just want to choose specific colors for specific values, or if you don't want to highlight the whole set.
The syntax is color "value". You can replace color with a named color or an HTML hex color code, and you can replace value with an actual value from your field. If you're coding more than one color "value", separate them with a comma.
By default, the geo template limits you to squares and straight lines, but if you want it to support flags as well, add @settings { renderer: canvas; } to your Advanced Editor.
