Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[Maps] use single layer for map labels #116840

Merged
merged 5 commits into from
Nov 1, 2021
Merged

[Maps] use single layer for map labels #116840

Show file tree
Hide file tree
Changes from 4 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
89ba9f5
[Maps] use single layer for map labels
nreese Oct 29, 2021
1de3a83
simplify filter expressions further
nreese Oct 29, 2021
e8440de
eslint
nreese Oct 29, 2021
92bf16a
Merge branch 'main' into remove_text_layer
kibanamachine Nov 1, 2021
a927063
update mapbox_style expect statements
nreese Nov 1, 2021
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion x-pack/plugins/maps/public/classes/layers/tiled_vector_layer/tiled_vector_layer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -319,9 +319,9 @@ export class TiledVectorLayer extends VectorLayer {
return;
}

this._setMbLabelProperties(mbMap, sourceMeta.layerName);
this._setMbPointsProperties(mbMap, sourceMeta.layerName);
this._setMbLinePolygonProperties(mbMap, sourceMeta.layerName);
this._setMbLabelProperties(mbMap, sourceMeta.layerName);
this._syncTooManyFeaturesProperties(mbMap);
}

Expand Down
51 changes: 7 additions & 44 deletions x-pack/plugins/maps/public/classes/layers/vector_layer/vector_layer.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -821,30 +821,11 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
timesliceMaskConfig?: TimesliceMaskConfig
) {
const sourceId = this.getId();
const labelLayerId = this._getMbLabelLayerId();
const pointLayerId = this._getMbPointLayerId();
const symbolLayerId = this._getMbSymbolLayerId();
const textLayerId = this._getMbTextLayerId();
const pointLayer = mbMap.getLayer(pointLayerId);
const symbolLayer = mbMap.getLayer(symbolLayerId);
const textLayer = mbMap.getLayer(textLayerId);

// Point layers require 2 mapbox layers

//
// Create label layer
// label layer - "symbol" layer type for labels. Can not use same layer label and marker layers because of conflicting styling requirements
//
if (!textLayer) {
const mbLayer: MbLayer = {
id: textLayerId,
type: 'symbol',
source: sourceId,
};
if (mvtSourceLayer) {
mbLayer['source-layer'] = mvtSourceLayer;
}
mbMap.addLayer(mbLayer);
}

//
// Create marker layer
Expand All @@ -865,7 +846,7 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
if (mvtSourceLayer) {
mbLayer['source-layer'] = mvtSourceLayer;
}
mbMap.addLayer(mbLayer, textLayerId);
mbMap.addLayer(mbLayer, labelLayerId);
}
if (symbolLayer) {
mbMap.setLayoutProperty(symbolLayerId, 'visibility', 'none');
Expand All @@ -881,7 +862,7 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
if (mvtSourceLayer) {
mbLayer['source-layer'] = mvtSourceLayer;
}
mbMap.addLayer(mbLayer, textLayerId);
mbMap.addLayer(mbLayer, labelLayerId);
}
if (pointLayer) {
mbMap.setLayoutProperty(pointLayerId, 'visibility', 'none');
Expand All @@ -891,7 +872,6 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
const filterExpr = getPointFilterExpression(this.hasJoins(), timesliceMaskConfig);
if (!_.isEqual(filterExpr, mbMap.getFilter(markerLayerId))) {
mbMap.setFilter(markerLayerId, filterExpr);
mbMap.setFilter(textLayerId, filterExpr);
}

if (this.getCurrentStyle().arePointsSymbolizedAsCircles()) {
Expand All @@ -908,16 +888,8 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
});
}

this.getCurrentStyle().setMBPropertiesForLabelText({
alpha: this.getAlpha(),
mbMap,
textLayerId,
});

this.syncVisibilityWithMb(mbMap, markerLayerId);
mbMap.setLayerZoomRange(markerLayerId, this.getMinZoom(), this.getMaxZoom());
this.syncVisibilityWithMb(mbMap, textLayerId);
mbMap.setLayerZoomRange(textLayerId, this.getMinZoom(), this.getMaxZoom());
}

_setMbLinePolygonProperties(
Expand All @@ -926,6 +898,7 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
timesliceMaskConfig?: TimesliceMaskConfig
) {
const sourceId = this.getId();
const labelLayerId = this._getMbLabelLayerId();
const fillLayerId = this._getMbPolygonLayerId();
const lineLayerId = this._getMbLineLayerId();

Expand All @@ -940,7 +913,7 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
if (mvtSourceLayer) {
mbLayer['source-layer'] = mvtSourceLayer;
}
mbMap.addLayer(mbLayer);
mbMap.addLayer(mbLayer, labelLayerId);
}
if (!mbMap.getLayer(lineLayerId)) {
const mbLayer: MbLayer = {
Expand All @@ -952,7 +925,7 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
if (mvtSourceLayer) {
mbLayer['source-layer'] = mvtSourceLayer;
}
mbMap.addLayer(mbLayer);
mbMap.addLayer(mbLayer, labelLayerId);
}

this.getCurrentStyle().setMBPaintProperties({
Expand Down Expand Up @@ -1018,10 +991,9 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {

_syncStylePropertiesWithMb(mbMap: MbMap, timeslice?: Timeslice) {
const timesliceMaskConfig = this._getTimesliceMaskConfig(timeslice);
this._setMbLabelProperties(mbMap, undefined, timesliceMaskConfig);
this._setMbPointsProperties(mbMap, undefined, timesliceMaskConfig);
this._setMbLinePolygonProperties(mbMap, undefined, timesliceMaskConfig);
// label layers added after geometry layers to ensure they are on top
this._setMbLabelProperties(mbMap, undefined, timesliceMaskConfig);
}

_getTimesliceMaskConfig(timeslice?: Timeslice): TimesliceMaskConfig | undefined {
Expand All @@ -1048,14 +1020,6 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
return this.makeMbLayerId('circle');
}

_getMbTextLayerId() {
return this.makeMbLayerId('text');
}

// _getMbTextLayerId is labels for Points and MultiPoints
// _getMbLabelLayerId is labels for not Points and MultiPoints
// _getMbLabelLayerId used to be called _getMbCentroidLayerId
// TODO merge textLayer and labelLayer into single layer
_getMbLabelLayerId() {
return this.makeMbLayerId('label');
}
Expand All @@ -1075,7 +1039,6 @@ export class VectorLayer extends AbstractLayer implements IVectorLayer {
getMbTooltipLayerIds() {
return [
this._getMbPointLayerId(),
this._getMbTextLayerId(),
this._getMbLabelLayerId(),
this._getMbSymbolLayerId(),
this._getMbLineLayerId(),
Expand Down
25 changes: 13 additions & 12 deletions x-pack/plugins/maps/public/classes/util/mb_filter_expressions.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ export function getFillFilterExpression(
): unknown[] {
return getFilterExpression(
[
EXCLUDE_CENTROID_FEATURES,
// explicit EXCLUDE_CENTROID_FEATURES filter not needed. Centroids are points and are filtered out by geometry narrowing
[
'any',
['==', ['geometry-type'], GEO_JSON_TYPE.POLYGON],
Expand All @@ -72,7 +72,7 @@ export function getLineFilterExpression(
): unknown[] {
return getFilterExpression(
[
EXCLUDE_CENTROID_FEATURES,
// explicit EXCLUDE_CENTROID_FEATURES filter not needed. Centroids are points and are filtered out by geometry narrowing
[
'any',
['==', ['geometry-type'], GEO_JSON_TYPE.POLYGON],
Expand All @@ -86,19 +86,18 @@ export function getLineFilterExpression(
);
}

const IS_POINT_FEATURE = [
'any',
['==', ['geometry-type'], GEO_JSON_TYPE.POINT],
['==', ['geometry-type'], GEO_JSON_TYPE.MULTI_POINT],
];

export function getPointFilterExpression(
hasJoins: boolean,
timesliceMaskConfig?: TimesliceMaskConfig
): unknown[] {
return getFilterExpression(
[
EXCLUDE_CENTROID_FEATURES,
[
'any',
['==', ['geometry-type'], GEO_JSON_TYPE.POINT],
['==', ['geometry-type'], GEO_JSON_TYPE.MULTI_POINT],
],
],
[EXCLUDE_CENTROID_FEATURES, IS_POINT_FEATURE],
hasJoins,
timesliceMaskConfig
);
Expand All @@ -111,9 +110,11 @@ export function getLabelFilterExpression(
): unknown[] {
const filters: unknown[] = [];

// centroids added for geojson sources only
if (isSourceGeoJson) {
filters.push(['==', ['get', KBN_IS_CENTROID_FEATURE], true]);
// Centroid feature added to GeoJSON feature collection for LINE_STRING, MULTI_LINE_STRING, POLYGON, MULTI_POLYGON, and GEOMETRY_COLLECTION geometries
// For GeoJSON sources, show label for centroid features or point/multi-point features only.
// no explicit isCentroidFeature filter is needed, centroids are points and are included in the geometry filter.
filters.push(IS_POINT_FEATURE);
}

return getFilterExpression(filters, hasJoins, timesliceMaskConfig);
Expand Down