Skip to content

refactor(dom-renderer): accept a per-side [top, right, bottom, left] boundsMargin #67

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

Merged
chiefcll merged 1 commit into from
Oct 4, 2026
Merged

refactor(dom-renderer): accept a per-side [top, right, bottom, left] boundsMargin #67

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
9 changes: 4 additions & 5 deletions src/core/dom-renderer/domRendererTypes.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@ import {
/** Based on {@link lng.CoreRenderer} */
export interface IRendererCoreRenderer {
mode: 'canvas' | 'webgl' | undefined;
boundsMargin?: number;
boundsMargin?: number | [number, number, number, number];
}
/** Based on {@link lng.TrFontManager} */
export interface IRendererFontManager {
Expand Down Expand Up @@ -148,9 +148,8 @@ export interface DomRendererMainSettings {
* Preload margin around the viewport, in logical pixels (default: 200)
*
* @remarks
* A single number applied to all sides. The `[top, right, bottom, left]`
* array form was dropped in renderer 1.8; it is still tolerated at runtime
* (the largest edge wins, with a warning) but should be replaced.
* A single number applied to all sides, or a per-side
* `[top, right, bottom, left]` tuple.
*/
boundsMargin?: number;
boundsMargin?: number | [number, number, number, number];
}
37 changes: 13 additions & 24 deletions src/core/dom-renderer/domRendererUtils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -222,30 +222,19 @@ export function nodeHasTextureSource(node: DOMNode): boolean {
}

/**
* Coerce a `boundsMargin` value to the scalar the renderer takes since 1.8.
*
* @remarks
* The `[top, right, bottom, left]` array form was dropped in renderer 1.8. An
* untyped app upgrading from 1.7 can still pass it, so mirror the WebGL
* renderer and take the widest edge rather than letting the margin arithmetic
* go wrong.
* Normalize a `boundsMargin` value (scalar or per-side tuple) into a
* `[top, right, bottom, left]` tuple.
*/
export function normalizeBoundsMargin(
margin: number | number[] | null | undefined,
): number {
if (margin == null) return 0;
if (Array.isArray(margin) === false) return margin as number;
const arr = margin as number[];
let max = 0;
for (let i = 0; i < arr.length; i++) {
if (arr[i]! > max) {
max = arr[i]!;
}
): [number, number, number, number] {
if (margin == null) return [0, 0, 0, 0];
if (Array.isArray(margin) === false) {
const m = (margin as number) || 0;
return [m, m, m, m];
}
console.warn(
`boundsMargin array form is no longer supported, using the largest edge value: ${max}`,
);
return max;
const arr = margin as number[];
return [arr[0] || 0, arr[1] || 0, arr[2] || 0, arr[3] || 0];
}

export function computeRenderStateForNode(
Expand Down Expand Up @@ -273,10 +262,10 @@ export function computeRenderStateForNode(
const right = left + width;
const bottom = top + height;

const expandedLeft = rootLeft - margin;
const expandedTop = rootTop - margin;
const expandedRight = rootRight + margin;
const expandedBottom = rootBottom + margin;
const expandedLeft = rootLeft - margin[3];
const expandedTop = rootTop - margin[0];
const expandedRight = rootRight + margin[1];
const expandedBottom = rootBottom + margin[2];

const intersectsBounds =
right >= expandedLeft &&
Expand Down
Loading