Mappedin JS - v6.14.0
    Preparing search index...

    Type Alias TAddPathOptions

    Options for controlling the behavior of a Path.

    type TAddPathOptions = {
        __EXPERIMENTAL_BILLBOARDING?: boolean;
        __EXPERIMENTAL_BORDER?: {
            color: "darken" | string;
            enabled: boolean;
            width?: number;
        };
        __EXPERIMENTAL_DASH_OPTIONS?: TExperimentalDashOptions;
        __EXPERIMENTAL_ENDCAP_EXTENSION?: [number, number];
        __EXPERIMENTAL_GEOMETRY?: "tube" | "ribbon";
        __EXPERIMENTAL_PREVENT_SELF_OVERLAP?: boolean;
        __EXPERIMENTAL_SMOOTHING_CORNER_RADIUS?: number;
        __EXPERIMENTAL_SMOOTHING_TENSION?: number;
        accentColor?: string;
        animateArrowsOnPath?: boolean;
        animateDrawing?: boolean;
        color?: string;
        dashed?: boolean;
        displayArrowsOnPath?: boolean;
        drawDuration?: number;
        flattenPath?: boolean;
        interactive?: boolean;
        pulseIterations?: number;
        pulsePauseDuration?: number;
        showPulse?: boolean;
        verticalOffset?: number;
        visible?: boolean;
        width?: number | Interpolation<"zoom-level", number[]>;
        xrayOpacity?: number;
    }
    Index

    Properties

    __EXPERIMENTAL_BILLBOARDING?: boolean

    When true and using ribbon geometry, the path will always face the camera (billboard effect). Most useful for vertical paths between floors.

    false
    
    __EXPERIMENTAL_BORDER?: {
        color: "darken" | string;
        enabled: boolean;
        width?: number;
    }

    Border configuration for ribbon path geometry. Renders darkened edges along both sides of the ribbon.

    Type Declaration

    • color: "darken" | string

      Border color - 'darken' to auto-darken main color, or explicit hex color string

    • enabled: boolean

      Whether the border is enabled

    • Optionalwidth?: number

      Border width as fraction of total ribbon width (0-0.5).

      0.1
      
    __EXPERIMENTAL_DASH_OPTIONS?: TExperimentalDashOptions

    Dash configuration. When dashed=true, controls dash/gap sizing. Uses discriminated union - mode determines which properties are valid.

    TExperimentalDashOptions

    __EXPERIMENTAL_ENDCAP_EXTENSION?: [number, number]

    Endcap extension for ribbon geometry as [start, end] tuple in meters.

    • Value > 0: extends path and renders rounded cap
    • Value = 0: square/flat end (no extension, no rounded cap)
    [0.5, 0.5]
    
    __EXPERIMENTAL_GEOMETRY?: "tube" | "ribbon"

    Geometry type for path rendering.

    • 'tube': Original tube geometry with 8 radial segments (default)
    • 'ribbon': Flat ribbon geometry with 2 vertices per segment
    'tube'
    
    __EXPERIMENTAL_PREVENT_SELF_OVERLAP?: boolean

    When true, prevents the xray path from rendering multiple overlapping pixels when the path crosses over itself. Uses stencil buffer to ensure single-pixel rendering.

    false
    
    __EXPERIMENTAL_SMOOTHING_CORNER_RADIUS?: number

    Distance in meters from corners where control points are inserted for smoothing. Higher values create smoother curves around corners. Only applies when __EXPERIMENTAL_SMOOTHING_TENSION > 0. Typical values are 0.5-2.0 meters for subtle smoothing.

    0.5
    
    __EXPERIMENTAL_SMOOTHING_TENSION?: number

    Controls the smoothness of path corners using CatmullRom curve tension. Higher values create smoother curves. Values between 0.1-0.3 provide subtle smoothing suitable for most use cases.

    0.0
    
    accentColor?: string

    Accent color that is applied to the path pulse and path arrows

    '#ffffff'
    
    animateArrowsOnPath?: boolean

    Animate arrows on path.

    true
    
    animateDrawing?: boolean

    Animate the drawing of the path in the direction of travel.

    true
    
    color?: string

    Path Colour. Color can be set using CSS colors names DarkGoldenRod, as Hex strings #0000FF or the rgb values rgb(255,0,0).

    #4b90e2
    
    dashed?: boolean

    Whether the path should be dashed.

    false
    
    displayArrowsOnPath?: boolean

    Show arrows on path.

    false
    
    drawDuration?: number

    Duration of path drawing in milliseconds.

    1500
    
    flattenPath?: boolean

    Flatten the path to a 2D line.

    false
    
    interactive?: boolean

    Whether the path should be clickable.

    false
    
    pulseIterations?: number

    Number of iterations to pulse to indicate direction.

    1
    
    pulsePauseDuration?: number

    How many milliseconds to wait before starting the next pulse after the current pulse travels the entirety of the path.

    750
    
    showPulse?: boolean

    Show an animated pulse indicating the direction of travel.

    true
    
    verticalOffset?: number

    How much the path hovers above the floor plane in meters.

    0.1
    
    visible?: boolean

    Whether the path should be visible.

    true
    
    width?: number | Interpolation<"zoom-level", number[]>

    The width of the path in meters. Can be a number or an Interpolation.

    Interpolation { on: 'zoom-level', input: [17, 22], output: [0.8, 0.4] }
    
    xrayOpacity?: number

    The opacity of the path when it's behind geometry (x-ray effect). Value from 0 to 1.

    0.25