The attributes of a technique.
Attributes corresponding to some decoded geometry. It may be either a map of multiple attributes or just a string with the geometry's feature id (id numbers are deprecated).
The object that defines what way an item of a {@link @here/harp-mapview#DataSource} should be decoded to assemble a tile.
The data stored in Buffers' elements can be of the following elementary types: float, signed or unsigned integers (8-bit, 16-bit or 32-bit long).
Render feature as set of circles rendered in screen space.
Value definition commons.
Decorate property type with possible dynamic variants.
Style used to draw a geometry as an extruded polygon, for example extruded buildings.
Represents "geometry" property of "Feature" GeoJSON object.
Represents a GeoJSON object.
The kind of geometry is used to group objects together, allowing the group to be hidden or displayed.
For efficiency, StyleSetEvaluator
returns Techniques
additional params as defined in
IndexedTechniqueParams
.
The type of the interpolation mode.
A type representing JSON arrays.
The JSON representation of an Expr object.
A type represeting JSON values.
Possible lights used for light the map.
The style type of the line caps.
The style type of the line dashes.
Render feature as line markers, which is a recurring marker along a line (usually road).
Render feature as line.
Available texture magnification filters.
Make runtime representation of technique attributes from JSON-compatible typings.
Translates
The labels of a MatchExpr expression.
Defines how to interpret the units.
Available texture minification filters.
Render feature as POIs (icons and text) rendered in screen space.
Render feature as segments.
Interface that defines the options to configure the sky.
Render feature as set of squares rendered in screen space.
Color literals.
Length literals.
Options to be passed to the StyleSetEvaluator
Basically identical as the DecoderOptions but requires styleSet to be set.
An array of Styles that are used together to define how a {@link @here/harp-mapview#DataSource} should be rendered.
Possible techniques that can be used to draw a geometry on the map.
The type representing the value of a property.
Available texture wrapping modes.
Array of all supported StringEncodedNumeralFormats describing color data.
Array of all supported StringEncodedNumeralFormats describing sizes, lengths and distances.
Array of supported StringEncodedNumeralFormats (intended to be indexed with StringEncodedNumeralType enum).
Names of the supported texture properties.
Names of the properties controlling transparency.
Add all the buffers of the technique to the transfer list.
Fills an index buffer with the indices for the edges of a polygon contour.
Edge index buffer to be filled.
Starting offset of the vertices composing the contour.
Number of elements per contour vertex.
Vertices that compose the contour.
Collection of booleans indicating if contour edges should be added.
Compose full texture name for given image name with technique specified. Some techniques allows to add prefix/postfix to icons names specified, this function uses technique information to create fully qualified texture name.
base name of the marker icon.
the technique describing POI or line marker.
fully qualified texture name for loading from atlas (without extension).
Evaluate feature attr without default value.
actual value or undefined
Evaluate feature attr with default value.
actual value or defaultValue
Returns an array with the data type specified as parameter.
specifies which type of data is being stored in the array
This is a utility function to retrive a definitions value until VerboseDefinition is fully deprecated
value of the given definition.
Feature id from the provided attribute map.
Determine the name of (OMV) feature. It implements the special handling required
to determine the text content of a feature from its tags, which are passed in as the env
.
Environment containing the tags from the (OMV) feature.
true
to use the abbreviation if available.
true
to use the tag "iso_code".
List of languages to use, for example: Specify "en" to use the tag "name_en" as the text of the string. Order reflects priority.
Determine the text string of the map feature. It implements the special handling required
to determine the text content of a feature from its tags, which are passed in as the env
.
technique defining how text should be created from feature
List of languages to use, for example: Specify "en" to use the tag "name_en" as the text of the string. Order reflects priority.
Returns the projection object specified in the parameter.
string describing projection to be used
String with the projection's name.
Projection
object containing the name of the projection to retrieve
Utility function to retrieve Styles until StylesDictionary is deprecated
Converts an InterpolatedPropertyDefinition to a JsonExpr.
A valid InterpolatedPropertyDefinition
Type guard to check if an object is an instance of BasicExtrudedLineTechnique
.
Type guard to check if an object is an instance of CirclesTechnique
.
Type guard to check if an object is an instance of BasicExtrudedLineTechnique
or StandardExtrudedLineTechnique
.
Type guard to check if an object is an instance of ExtrudedPolygonTechnique
.
Type guard to check if an object is an instance of FillTechnique
.
Checks if a property is interpolated.
property to be checked
Checks if the given value is a reference to a definition.
The value of a technique property.
Type guard to check if an object is an instance of LineMarkerTechnique
.
Type guard to check if an object is an instance of LineTechnique
.
Type guard to check if an object is an instance of PoiTechnique
.
Type guard to check if an object is an instance of SegmentsTechnique
.
Type guard to check if an object is an instance of ShaderTechnique
.
Type guard to check if an object is an instance of SolidLineTechnique
.
Type guard to check if an object is an instance of SolidLineTechnique
and is a kind that
has special dashes.
Type guard to check if an object is an instance of SquaresTechnique
.
Type guard to check if an object is an instance of StandardExtrudedLineTechnique
.
Type guard to check if an object is an instance of StandardTechnique
.
Utility function to distinguish Styles until StylesDictionary is deprecated
Type guard to check if an object is an instance of TerrainTechnique
.
Type guard to check if an object is an instance of TextTechnique
.
Type guard to check if an object is an instance of TextureBuffer
.
This is to distinguish between definition types at runtime, to be deprecated with VerboseDefinition
true
if the Definition is of the deprecated VerboseDefinition type
Create transferable representation of dynamic technique.
Converts non-transferable Exprinstances back to JSON form.
Check if vertex normals should be generated for this technique (if no normals are in the data).
Technique to check.
Parse string encoded color value using all known StringEncodedColorFormats.
The string encoded color expression (i.e. '#FFF', 'rgb(255, 0, 0)', etc.).
The color parsed or undefined if non of the known representations matches the expression provided in [[color]].
Parse string encoded numeral values using all known StringEncodedNumeralFormats.
The string representing numeric value.
The ratio used to convert from meters to pixels (default 1.0).
Number parsed or undefined if non of the numeral patterns matches the expression provided in [[numeral]].
Determine whether to scale heights by the projection scale factor for geometry using the given technique.
Context for evaluation of technique attributes.
Technique to be evaluated.
The level of the tile where the geometry is stored.
true
if height must be scaled, false
otherwise.
Sets a technique's render order (or priority for screen-space techniques) depending on its category and the priorities specified in a given theme.
Type guard to check if an object is an instance of a technique with textures.
Get the texture coordinate type if the technique supports it.
Converts backwards compatible transient property to pure {@type Pickabilty} object
The transient property from the style
Generated using TypeDoc
@here/harp-datasource-protocol
Overview
The DataSource Protocol package contains components used for the decoding and styling of data that is used by the Datasources. This code is shared between the ui-thread and the web-workers which are used to parallelise the decoding of the data.
Techniques
This module contains interfaces for choosing techniques form the techniques catalog that are applied via the theme files to draw geometries on the map canvas.
The supported techniques that can be used to draw on the map are:
All the techniques are documented in the
Techniques
class' source code.To set a technique in a theme file, you can use a
technique
property. See examples below.How to Style a Map? - Overview of harp.gl's Map Styling
Techniques can be used to render map objects on the canvas in a certain way. The visual attributes of these techniques are defined and placed in the theme file.
The theme JSON file enables writing conditions which the data received from the datasource must match for a style to be applied to it. When a condition is met a set of attributes are applied to the map object is changed according to a set of predefined attributes. There is an example of a minimal theme file below. It styles the names of continents and draws a line around islands, archipelagos, cliffs and bridges.
The theme file enables to define multiple
styles
which are bound to the data format received from a datasource (for example a tilezen based one, check here for more information on tilezen vector tile datasource).{ "styles": [ { "styleSet": "tilezen", "layer": "earth", "when": "kind in ['continent']", "technique": "text", "priority": ["step", ["zoom"], 0, 2, 120, 3, 100, 4, 60 ], "color": "#E48892", "fontVariant": "AllCaps", "opacity": 0.6 }, { "styleSet": "tilezen", "layer": "earth", "when": ["match", ["get", "kind"], ["archipelago", "cliff", "ridge", "island"], true, false ], "technique": "line", "color": "#C1BDB3" } ]
The conditions can be based on the datasource metadata (for example data layer like water or buildings or a specific flag like
isBridge
).An example theme file used in harp-examples could be found in the berlin_tilezen_base.json. Theme file is closely connected with the type of data received from the datasource.
"technique"
- determines which technique should be applied to objects fulfilling the condition{ "styleSet": "tilezen", "description": "Exemplary theme condition", "when": ["any", ["==", ["get", "kind_detail"], "pier"], ["==", ["get", "landuse_kind"], "pier"], ], "technique": "solid-line", "color": "#00f", "lineWidth": ["interpolate", ["linear"], ["zoom"], 13, "1.5px", 14, "1.2px", 15, "0.9px" ] }
Feature Selection Expressions
In the above example there is a condition used within the theme which is applying a solid-line technique to a map feature which has a
kind_detail
orlanduse_kind
property equal to pier. The line is rendered with different line widths depending on the current map zoom level.Note that the typical logical operators like:
all
for computing the conjunction of sub-conditionsany
for computing the alternative of sub-conditions"when"
- is a property that holds a description of the condition. This condition queries the feature data which and uses one or many of the following operators:~=
(tilde equal), returns true when the value on the left contains the value on the right, for example:this condition would match
kind_detail
s like national_park_, _natural_park_, _theme_park but also parking^=
(caret equal), returns true when the value on the left starts with the value on the right, for example:the above condition would match
kind_detail
s like: water_park_, _water_slide or water_works but not drinking_water$=
(dollar equal), returns true when the value on the left ends with the value on the right, for example:the above condition would match
kind_detail
s like: drinking_water but not water_park==
(equal equal), returns true when the value on the left is equal to the value on the right, for example:the above condition would match roads
$layer
and thekind
of rail!=
(exclamation mark equal), returns true when the value on the left is not equal to the value on the right, for example:the above condition would match all
kind
s which are not rail on the roads$layer
For more in-depth details about the equality operators check the @here/harp-datasource-protocol/lib/Theme.ts.
Additionally there are two more operators available (
has
andin
):has(
_variable name_)
returns true when the feature contains the specified variable and it is not _undefined_, for example:the above condition would match all
kind
s which have the value lake or the area property defined.in[
_array of possible values_]
returns true when the feature contains one of the values specified in the array, for example:the above conditions would match all features from
earth
layer whichkind
is equal either to 'archipelago', 'cliff' or 'island'.Where to put style changes for a certain feature or map object?
A style for a certain feature (map object) on the map is kept in the
attr
object. Here is an example:A list of possible style modifier for each techniques can be found in the
Techniques
class' source code.Most common properties include:
priority
: Sets apriority
of a map object, defaults to0
. Objects with highest priority get placed first. Can be defined to vary depending on the zoom level with some default value. (see the example above).renderOrder
: which enables to define the render order of the objects created using a particular technique.color
: color in hexadecimal or CSS-style notation, for example:"#e4e9ec"
,"#fff"
,"rgb(255, 0, 0)"
,"rgba(127, 127, 127, 1.0)"
, or"hsl(35, 11%, 88%)"
.