Leaflet Map Control

Use Thematic (Unique Value) Markers in a Map

Technologies > User Interface Add-Ins > Geographic Information System (GIS) Views > Thematic (Unique Value) Markers (Leaflet)

This example displays thematic markers by building use. Markers are colored according to building use where each building use is represented a unique color. A marker legend defining the marker classes appears on the map.

03000009_624x339.png

To use thematic markers, add the required thematic marker options to markerProperties . By specifying an empty array for uniqueValues , the map control will automatically determine and include all the distinct building use values.  Alternatively, you may specify the values to include.  This approach uses the thematic-unique-values renderer.

var markerProperties = { //optional radius: 7, fillColor: '#e41a1c', fillOpacity: 0.90, stroke: true, strokeColor: '#fff', strokeWeight: 1.0, // required for thematic markers renderer: 'thematic-unique-values', thematicField: 'bl.use1', uniqueValues: [], colorBrewerClass: 'Set1' }; this.mapControl.createMarkers( dataSource,
geometryFields,
titleField,
contentFields,
markerProperties
);

To display the markers, create the restriction and show the markers:

<action id="showLegend" imageName="/schema/ab-core/graphics/icons/view/ab-arcgis-legend-16.png">
<tooltip>Legend</tooltip>
</action>

To include a marker legend, include a showLegend panel action in AXVW:

<action id="showLegend" imageName="/schema/ab-core/graphics/icons/view/ab-arcgis-legend-16.png">
<tooltip>Legend</tooltip>
</action>

To show the legend, add an event handler in the JS:

var legendObj = Ext.get('showLegend');
legendObj.on('click', this.showLegend, this, null); showLegend: function(){
mapController.mapControl.showMarkerLegend();
}

View: http://localhost:8080/archibus/ab-leaflet-map-thematic-unique-value-renderer.axvw