weasel API - v0.8.0
    Preparing search index...

    Interface CreateViewportLayerOpts<TData>Experimental

    A "viewport node" — a screen-space rectangle on the outer canvas that re-renders one or more source layers through an inner View, then clips them to its rect.

    Use cases: picture-in-picture, minimap, scrolling container, multi-angle preview. The same source layer can be rendered through multiple viewports (different inner views) without duplicating data — viewports are pure lenses on the source.

    Inner view semantics. The source layers draw as if the inner view filled the screen at world-origin (their own viewToMat3(innerView) runs normally). The viewport then translates the result so that the inner view's origin lands at bounds.x, bounds.y and clips to (bounds.w, bounds.h). Caller chooses innerView.{x,y,scale} to control which slice of source-world is shown.

    Hit-testing is not wired up yet — pointer events still target the outer view. A follow-up task adds dispatcher-side re-projection so a click inside a viewport translates to inner-world coords.

    Screen-space source layers (e.g., debug overlays, selection chrome) still render to the outer canvas, not into the viewport. To include them, wrap them as world-space layers first.

    interface CreateViewportLayerOpts<TData> {
        background?: string;
        bounds: (
            outer: View,
            dims: Dims,
        ) => { h: number; w: number; x: number; y: number };
        id: string;
        label: string;
        source: RenderLayer<TData>[];
        view: View;
    }

    Type Parameters

    • TData
    Index

    Properties

    background?: string

    Optional opaque background painted before the source layers. Useful to keep the underlying outer canvas from showing through when the inner view leaves part of the viewport empty.

    bounds: (
        outer: View,
        dims: Dims,
    ) => { h: number; w: number; x: number; y: number }

    Where on the outer canvas this viewport is painted, in screen-space CSS pixels. Recomputed every frame so the rect can track an outer pose, follow a corner, etc.

    id: string
    label: string
    source: RenderLayer<TData>[]

    Layers re-rendered through view. Each receives (data, view, dims) exactly as the outer Canvas would call it.

    view: View

    The inner view. Static for now — a future revision will accept View | (outer: View, dims: Dims) => View so derivations like parallax and node-anchored scroll can compose.