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

Improve rendering performance of symbols with symbol-sort-key #9751

Merged
merged 3 commits into from
Aug 11, 2020
Merged

Improve rendering performance of symbols with symbol-sort-key #9751

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
73631f5
Dont sort symbol features if they dont overlap
osvodef Jun 3, 2020
f93d8e7
Move canOverlap to SymbolBucket constructor
osvodef Aug 9, 2020
7f5cfdc
Remove leftover function arguments
osvodef Aug 11, 2020
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
12 changes: 9 additions & 3 deletions src/data/bucket/symbol_bucket.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -322,6 +322,7 @@ class SymbolBucket implements Bucket {
fadeStartTime: number;
sortFeaturesByKey: boolean;
sortFeaturesByY: boolean;
canOverlap: boolean;
sortedAngle: number;
featureSortOrder: Array<number>;

Expand Down Expand Up @@ -367,10 +368,14 @@ class SymbolBucket implements Bucket {
const layout = this.layers[0].layout;
const sortKey = layout.get('symbol-sort-key');
const zOrder = layout.get('symbol-z-order');
this.canOverlap =
layout.get('text-allow-overlap') ||
layout.get('icon-allow-overlap') ||
layout.get('text-ignore-placement') ||
layout.get('icon-ignore-placement');
this.sortFeaturesByKey = zOrder !== 'viewport-y' && sortKey.constantOr(1) !== undefined;
const zOrderByViewportY = zOrder === 'viewport-y' || (zOrder === 'auto' && !this.sortFeaturesByKey);
this.sortFeaturesByY = zOrderByViewportY && (layout.get('text-allow-overlap') || layout.get('icon-allow-overlap') ||
layout.get('text-ignore-placement') || layout.get('icon-ignore-placement'));
this.sortFeaturesByY = zOrderByViewportY && this.canOverlap;

if (layout.get('symbol-placement') === 'point') {
this.writingModes = layout.get('text-writing-mode').map(wm => WritingMode[wm]);
Expand Down Expand Up @@ -609,6 +614,7 @@ class SymbolBucket implements Bucket {
lineOffset: [number, number],
alongLine: boolean,
feature: SymbolFeature,
layer: SymbolStyleLayer,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

layer is no longer used, so this is a leftover right?

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh, didn't catch that! Fixed 🙂

writingMode: any,
labelAnchor: Anchor,
lineStartIndex: number,
Expand All @@ -618,7 +624,7 @@ class SymbolBucket implements Bucket {
const indexArray = arrays.indexArray;
const layoutVertexArray = arrays.layoutVertexArray;

const segment = arrays.segments.prepareSegment(4 * quads.length, layoutVertexArray, indexArray, feature.sortKey);
const segment = arrays.segments.prepareSegment(4 * quads.length, layoutVertexArray, indexArray, this.canOverlap ? feature.sortKey : undefined);
const glyphOffsetArrayStart = this.glyphOffsetArray.length;
const vertexStartIndex = segment.vertexLength;

Expand Down
6 changes: 4 additions & 2 deletions src/render/draw_symbol.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -236,7 +236,8 @@ function drawLayerSymbols(painter, sourceCache, layer, coords, isText, translate
// Unpitched point labels need to have their rotation applied after projection
const rotateInShader = rotateWithMap && !pitchWithMap && !alongLine;

const sortFeaturesByKey = layer.layout.get('symbol-sort-key').constantOr(1) !== undefined;
const hasSortKey = layer.layout.get('symbol-sort-key').constantOr(1) !== undefined;
let sortFeaturesByKey = false;

const depthMode = painter.depthModeForSublayer(0, DepthMode.ReadOnly);

Expand Down Expand Up @@ -333,7 +334,8 @@ function drawLayerSymbols(painter, sourceCache, layer, coords, isText, translate
hasHalo
};

if (sortFeaturesByKey) {
if (hasSortKey && bucket.canOverlap) {
sortFeaturesByKey = true;
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I'm just not sure about this particular bit — we need sortFeaturesByKey after this loop, so I had to assign it like this.

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah, this looks good.

const oldSegments = buffers.segments.get();
for (const segment of oldSegments) {
tileRenderState.push({
Expand Down
3 changes: 3 additions & 0 deletions src/symbol/symbol_layout.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -518,6 +518,7 @@ function addTextVertices(bucket: SymbolBucket,
textOffset,
textAlongLine,
feature,
layer,
writingMode,
anchor,
lineArray.lineStartIndex,
Expand Down Expand Up @@ -646,6 +647,7 @@ function addSymbol(bucket: SymbolBucket,
iconOffset,
iconAlongLine,
feature,
layer,
false,
anchor,
lineArray.lineStartIndex,
Expand All @@ -665,6 +667,7 @@ function addSymbol(bucket: SymbolBucket,
iconOffset,
iconAlongLine,
feature,
layer,
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

3 layer leftovers here too,

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Fixed

WritingMode.vertical,
anchor,
lineArray.lineStartIndex,
Expand Down