Skip to content

Commit

Permalink
fix(parser): add an option to parse symbols as circles in VT
Browse files Browse the repository at this point in the history
Some modifications have been done on the Style in prevision of the
support of symbol in Vector Tiles, but previously the symbols were
represented as circle.

To get back to this behavior, a flag (`symbolToCircle`) can be specified
in the options of the ColorLayer containing a VectorTileSource.

Fix #1310
  • Loading branch information
zarov authored and gchoqueux committed Feb 5, 2020
1 parent 95e420b commit 586dbb2
Show file tree
Hide file tree
Showing 3 changed files with 11 additions and 7 deletions.
13 changes: 7 additions & 6 deletions src/Core/Style.js
Original file line number Diff line number Diff line change
Expand Up @@ -126,9 +126,10 @@ class Style {
* @param {object} layer vector tile layer.
* @param {Number} zoom vector tile layer.
* @param {Object} sprites vector tile layer.
* @param {boolean} [symbolToCircle=false]
* @returns {Style}
*/
setFromVectorTileLayer(layer, zoom, sprites) {
setFromVectorTileLayer(layer, zoom, sprites, symbolToCircle = false) {
if (layer.type === 'fill' && !this.fill.color) {
const { color, opacity } = rgba2rgb(readVectorProperty(layer.paint['fill-color'] || layer.paint['fill-pattern']));
this.fill.color = color;
Expand All @@ -152,6 +153,11 @@ class Style {
this.stroke.lineCap = layer.layout && layer.layout['line-cap'];
this.stroke.width = readVectorProperty(layer.paint['line-width'], zoom) || 3.0;
this.stroke.opacity = readVectorProperty(layer.paint['line-opacity'], zoom) || opacity || 1.0;
} else if (layer.type === 'circle' || symbolToCircle) {
const { color, opacity } = rgba2rgb(readVectorProperty(layer.paint && layer.paint['circle-color'], zoom) || '#000000ff');
this.point.color = color;
this.point.opacity = opacity;
this.point.radius = readVectorProperty(layer.paint['circle-radius'], zoom) || 1.5;
} else if (layer.type === 'symbol') {
// overlapping order
this.text.zOrder = readVectorProperty(layer.layout && layer.layout['symbol-z-order'] || 'auto', zoom);
Expand Down Expand Up @@ -207,11 +213,6 @@ class Style {
Cache.set(`${iconSrc}-${size}`, this.icon);
}
}
} else if (layer.type === 'circle') {
const { color, opacity } = rgba2rgb(readVectorProperty(layer.paint && layer.paint['circle-color']), zoom);
this.point.color = color;
this.point.opacity = opacity;
this.point.radius = readVectorProperty(layer.paint['circle-radius'], zoom);
}
return this;
}
Expand Down
4 changes: 3 additions & 1 deletion src/Parser/VectorTileParser.js
Original file line number Diff line number Diff line change
Expand Up @@ -149,7 +149,7 @@ function readPBF(file, options) {
let style = styleCache.get(tag);
if (!style) {
style = new Style();
style.setFromVectorTileLayer(layer, extentSource.zoom, options.sprites);
style.setFromVectorTileLayer(layer, extentSource.zoom, options.sprites, options.symbolToCircle);
styleCache.set(tag, style);
}
const order = allLayers.findIndex(l => l.id == layer.id);
Expand Down Expand Up @@ -202,6 +202,8 @@ export default {
* or other system. See [this link]{@link
* https://alastaira.wordpress.com/2011/07/06/converting-tms-tile-coordinates-to-googlebingosm-tile-coordinates}
* for more informations.
* @param {boolean} [options.symbolToCircle=false] - If true, all symbols
* from a tile will be considered as circle, and render as circles.
*
* @return {Promise} A Promise resolving with a Feature or an array a
* Features.
Expand Down
1 change: 1 addition & 0 deletions src/Provider/DataSourceProvider.js
Original file line number Diff line number Diff line change
Expand Up @@ -28,6 +28,7 @@ function parseSourceData(data, extDest, layer) {
mergeFeatures: layer.mergeFeatures === undefined ? true : layer.mergeFeatures,
withNormal: layer.isGeometryLayer,
withAltitude: layer.isGeometryLayer,
symbolToCircle: layer.symbolToCircle || false,
};

return source.parser(data, options).then(parsedFile => source.onParsedFile(parsedFile));
Expand Down

0 comments on commit 586dbb2

Please sign in to comment.