FeatureType and PropertyType format

Every layer consists of many features, be it points, lines, polygons or multi-polygons. And most features have many properties beside the geometry and id. In order to visualize them attractively, we created the FeatureType and PropertyType format, respectively.

FeatureType

A FeatureType may contain the following properties:

• id (string): You don't need to specify it, but every feature will receive a GUID upon loading
• name (string): displayed when hovering over the item, and in the property panel
• style (IFeatureTypeStyle): specifies the foreground and background color, line width, etc.
• languages (ILanguageData): localized information
• contourProperty: name of the property that contains a stringified L.GeoJSON object, which is shown when hovering above a feature
• properties ([key: string]: any): a list of properties

FeatureTypeStyle

• nameLabel (string): Default value is Name, i.e. the feature.properties.Name contains the title/name of the feature.
• fillColor (string): e.g. 'red' or '#FF0000'
• strokeColor (string): as above
• selectedFillColor (string): as above, shown when selected
• selectedStrokeColor (string): as above
• selectedStrokeWidth (number): width of stroke outline when selected
• height (number):
• opacity (number):
• fillOpacity (number):
• stroke (boolean):
• drawingMode (string): e.g. point, line, polyline, polygon, or multi-polygon
• strokeWidth (number):
• iconWidth (number): size of the icon in pixels
• iconHeight (number): size of the icon in pixels
• iconUri (string): URI of icon
• modelUri (string):
• modelScale (number):
• modelMinimumPixelSize (number):
• cornerRadius (number): rounding
• maxTitleResolution (string): when to hide the title
• rotate (number):
• innerTextProperty (string): set a text in a feature
• innerTextSize (number):
• analysispropertyType (any):
• rotateProperty (string): e.g. when the property is updated dynamically, the object may rotate (e.g. in a simulation)

PropertyType

String formatted text

String formatted text can be used in two locations:

• When resolving the name of an item
• For the iconUri

Resolving the name of an item

Often, a feature contains a property Name (e.g. feature.properties.Name), which is used all over the place: in the side bar, in the tooltips, for legends etc. In case you didn't supply a Name, this generates a lot of exceptions when trying to use it, so we enforce that each feature has a name when initializing the feature. In addition, we do this because often the name reflects some other properties of a feature, and you don't want to add the information twice.

How does it work? Add a PropertyType, whose label="Name", whose type="stringFormat" and whose stringFormat contains the formatting. An example is probably easier to understand: stringFormat="{street} {houseNumber}, {zipCode}" takes the three properties, street, houseNumber and zipCode, and substitutes them in the string.

Icons

You sometimes wish to base the image of a feature on some property, e.g. the energy label. So for each energy label, you have a different icon. You can do this by adding multiple property types, each specifying a different iconUri, and adding the property.FeatureType with the respective name to each feature too. Besides increasing the size of the geojson files considerably, it is also quite cumbersome. For that reason, the iconUri can also contain a string formatting. When resolving the feature.style.iconUri, check whether we are dealing with a stringFormatted uri, e.g. images/LabelledHouse-{energyLabel}.png

In this case, the energyLabel, a property of the feature, is used to resolve the uri, so this could become when the energyLabel = 4: images/LabelledHouse-4.png

So for each energyLabel (including the missing label, if any), you need to supply an image. Further note that, for the legend, we also need an iconUri that is independent of the feature: in this case, the brackets are removed, e.g. images/LabelledHouse-energyLabel.png

So in case of 5 energy labels, you need to supply the following icoms:

• LabelledHouse-energyLabel.png (legend)
• LabelledHouse-.png (missing)
• LabelledHouse-1.png
• LabelledHouse-2.png
• LabelledHouse-3.png
• LabelledHouse-4.png
• LabelledHouse-5.png