This geo services plugin integrates Maplibre GL mapping library into the Qt Location API.
This plugin differs from all the other plugins because it uses the Maplibre GL map engine for rendering vector tiles in real-time. The benefits are: text staying upright, font antialiasing, labels flowing between zoom levels, smooth pan, tilt, rotation and continuous zoom.
The appearance and behavior of vector maps can be customized by creating custom map styles. This can be done with tools like Mapbox Studio.
The Maplibre GL geo services plugin can be loaded by using the plugin key "maplibregl".
This plugin requires custom backend or service provider for providing vector tiles. Read more OpenMaptiles about setting up custom backend.
Note: the API for this plugin is introduced in Qt 5.9 as technology preview.
Qt Location Maplibre GL Plugin has the following support for platforms:
The following table lists optional parameters that can be passed to the Maplibre GL plugin.
| Parameter | Description |
|---|---|
| maplibregl.settings_template | Different backends (tile providers) have different ways to serve information. Base URL, HTTP paths for style, fonts, tiles, etc. Maplibre GL library has predefined sets of settings for most popular providers. This parameter can be used to use one of these predefined settings for values "mapbox", "maptiler" or "maplibre". |
| maplibregl.access_token | Access token, if needed by service provider. |
| maplibregl.api_base_url | Set a custom API base URL. When not set, the URL defaults to the value set by maplibregl.settings_template. |
| maplibregl.mapping.additional_style_urls | Additional, comma separated, style URLs to be added to the available style URLs. Additional styles will be prepended to the supportedMapTypes property of the Map item. |
| maplibregl.mapping.cache.directory |
Absolute path to map tile cache directory used as network disk cache.
The default place for the cache is the This is an ambient cache, meaning it will get populated on the fly until it reaches the size limit, and when that happens, it will evict the least used tiles. |
| maplibregl.mapping.cache.memory | Whether or not the cache should be in-memory only. Valid values are true and false. The default value is false. When set to true, the disk cache is never created. The ambient cache will work in-memory, but the offline database cannot be used with this option enabled. |
| maplibregl.mapping.cache.size | Cache size for map resources in bytes. The default size of this cache is 50 MiB. |
| maplibregl.mapping.use_fbo | Sets whether to use a framebuffer object to render Maplibre GL Native. Valid values are true and false. The default value is true. When set to false, the map is rendered issuing OpenGL commands directly, through a QSGRenderNode, to improve the rendering performance. This mode is experimental, and it does not support QQuickItem transformations nor stencil clipping. It might be also produce rendering artifacts e.g. when adding it inside a Flipable item. |
| maplibregl.mapping.items.insert_before | Some map items such as MapPolyline, MapPolygon and MapRectangle will be rendered after the topmost layer of the style. With this parameter set, the map items will be rendered before the layer ID specified, unless the layer is not present on the current style, which will fallback to the default behavior. This parameter can be used to display route lines under labels. |
The Map item using this plugin, can also be customized using DynamicParameters, allowing runtime changes to the map style and data.
Examples of what can be currently controlled using DynamicParameter are:
With the exception of extrusion and data driven style properties, every property described at the Maplibre Style Specification can be changed at runtime.
The DynamicParameters, used to control the style of the map at runtime, always have a type property, followed by user defined properties that try to match the Maplibre Style Specification naming as much as possible, replacing the dash with camel case for technical reasons (i.e. line-cap will be translated to lineCap).
| Parameter type | Description |
|---|---|
| source | A style data source. When using a source of sourceType geojson, the data property can be both inlined or sourced from qrc. Supported source types are: vector, raster, raster-dem, image and geojson. 'geojson'. |
| layer | Adds a new style layer to the map. On a Maplibre GL map, layers are used in styles for adding styling rules to specific subsets of data. A layer will contain a reference to the data for which they are defining a style. Use the before attribute to insert a layer before an existing layer. |
| paint | Defines how a layer will be painted. Paint properties can be used for changing the color and opacity of roads in the map or the land color, among other things. |
| layout | Defines how a layer will be layouted. Layout properties can be used for setting a layer's visibility, and for defining the spacing between dashes in a dashed line, among other things. |
| image | Adds a sprite to the map to be used by a style layer. This property is required if any style layer uses the properties such as backgroundPattern, fillPattern, linePattern, or iconImage. |
| filter | A filter selects specific features from a layer. This can be used for adding a layer from a GeoJSON source based on specific parts of the data source, like by using only the points in the GeoJSON. |
This example adds inline GeoJSON data to the map. Simply adding a source is not enough to get the data visible. It is also necessary to create a layer based on this source. After the layer is added, we also need to style its paint and layout properties. In this case we are changing the line color to blue, and the line width to 8 pixels, as well as also setting round line joints and caps.
Map {
plugin: Plugin {
name: "maplibregl"
PluginParameter { name: "maplibregl.settings_template"; value: "mapbox" }
}
center: QtPositioning.coordinate(60.170448, 24.942046) // Helsinki
zoomLevel: 12
DynamicParameter {
type: "source"
property var name: "routeSource"
property var sourceType: "geojson"
property var data: '{ "type": "FeatureCollection", "features": \
[{ "type": "Feature", "properties": {}, "geometry": { \
"type": "LineString", "coordinates": [[ 24.934938848018646, \
60.16830257086771 ], [ 24.943315386772156, 60.16227776476442 ]]}}]}'
}
DynamicParameter {
type: "layer"
property var name: "route"
property var layerType: "line"
property var source: "routeSource"
// Draw under the first road label layer
// of the mapbox-streets style.
property var before: "road-label-small"
}
DynamicParameter {
type: "paint"
property var layer: "route"
property var lineColor: "blue"
property var lineWidth: 8.0
}
DynamicParameter {
type: "layout"
property var layer: "route"
property var lineJoin: "round"
property var lineCap: "round"
}
}
Note that the order we add the parameters is important, because there is dependency between the parameters. Adding a layer before adding a source will create an invalid layer, same goes for adding a paint property for a layer that doesn't exist.
Paint and layout properties can also be used for styling existing layers of the current style, and not only layers created at runtime. Mapbox Studio can be used for inspecting layers of a given style.
