Surface 3d

data

A grid as { x, y, z }. z[row][column] is the height at x[column], y[row]. null creates a gap.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• Surface3DData

  Type definition

width

Chart width in pixels. If the container width changes, update width from a ResizeObserver.

height

Chart height in pixels. Allow space for axes, titles, and the legend.

brandLogo

The default is the Syidax symbol and wordmark. With the Pro chart.branding entitlement, set none to remove it or provide a PNG, JPEG, or WebP data URL to replace it.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

brandPosition

The corner where the logo is anchored. Community and Pro both support all four corners, using the same position on screen and in image exports.

colors

Pass as a JavaScript property. type: HeatmapColorInput.

• HeatmapColorInput

  Type definition

colorDomain

Pass as a JavaScript property. type: Surface3DDomain.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• Surface3DDomain

  Type definition

missingColor

Set as an HTML attribute or JavaScript property. type: string.

surfaceSize

Pass as a JavaScript property. type: Scene3DVector.

• Scene3DVector

  Type definition

opacity

Set as an HTML attribute or JavaScript property. type: number.

legend

Whether to show a legend for series or items.

locale

Set as an HTML attribute or JavaScript property. type: string.

axes

Pass as a JavaScript property. type: Surface3DAxesOptions|boolean|string.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• Surface3DAxesOptions

  Type definition

wireframe

Set as an HTML attribute or JavaScript property. type: boolean.

wireWidth

Set as an HTML attribute or JavaScript property. type: number.

wireColor

Set as an HTML attribute or JavaScript property. type: string.

material

Pass as a JavaScript property. type: Scene3DMaterialOptions.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• Scene3DMaterialOptions

  Type definition

lighting

Pass as a JavaScript property. type: Scene3DLightingOptions.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• Scene3DLightingOptions

  Type definition

camera

Pass as a JavaScript property. type: Scene3DCameraOptions|string.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• Scene3DCameraOptions

  Type definition

orbit

Pass as a JavaScript property. type: Orbit3DOptions|boolean|string.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• Orbit3DOptions

  Type definition

showEmpty

Whether the component shows its own empty-geometry notice.

chartTitle

The title inside the chart. Explain the data's unit and meaning alongside it.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

chartSubtitle

The subtitle inside the chart.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

activeColor

Set as an HTML attribute or JavaScript property. type: string.

enableMouseTracking

Set as an HTML attribute or JavaScript property. type: boolean.

tooltip

Tooltip settings for pointer-driven values, position, and content.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• CartesianTooltipInput

  Type definition

tooltipEnabled

Set as an HTML attribute or JavaScript property. type: boolean.

tooltipFormat

Pass as a JavaScript property. type: (detail:Surface3DHitDetail)=>string.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• Surface3DHitDetail

  Type definition

crosshair

Pass as a JavaScript property. type: CartesianCrosshairInput.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• CartesianCrosshairInput

  Type definition

crosshairSnapDistance

Set as an HTML attribute or JavaScript property. type: number.

animated

Whether to animate initial display and data changes.

animationDuration

Animation duration in milliseconds.

animationEasing

Allowed values: linear, ease-out, ease-in, ease-in-out. Default: 'ease-out'.

• Surface3DEasing

  Type definition

animationType

Allowed values: initial, update. Default: undefined.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• HeatmapAnimationType

  Type definition

streamSource

A stream source for live data. Check the contract for the specific type.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

• Surface3DStreamSource

  Type definition

streamMax

The maximum number of streaming data points to retain.

undefined means this property was not explicitly set. The effective value may depend on the chart type and other settings.

engine

Renderer selection: auto, standard, or pro. Engine selection is separate from permission to use a Pro chart type.

• Surface3DEngineMode

  Type definition

unavailable

Allowed values: fallback, error. Default: 'fallback'.

• Surface3DUnavailableBehaviour

  Type definition

rendered

Emits rendering results in detail when chart drawing completes.

Event name: rendered. Names are case-sensitive. Read the payload from detail on CustomEvent<Surface3DRenderResult&{tier:Surface3DEngineTier}>.

chart.addEventListener('rendered', event => {
  console.log(event.detail); // Surface3DRenderResult&{tier:Surface3DEngineTier}
});

• Surface3DRenderResult

  Type definition

• Surface3DEngineTier

  Type definition

pointClick

A point selection event. Read the selected data and index from CustomEvent.detail.

Event name: pointClick. Names are case-sensitive. Read the payload from detail on CustomEvent<Surface3DHitDetail>.

chart.addEventListener('pointClick', event => {
  console.log(event.detail); // Surface3DHitDetail
});

• Surface3DHitDetail

  Type definition

pointHover

CustomEvent.detail type: Surface3DHitDetail|null. Event names are case-sensitive.

Event name: pointHover. Names are case-sensitive. Read the payload from detail on CustomEvent<Surface3DHitDetail|null>.

chart.addEventListener('pointHover', event => {
  console.log(event.detail); // Surface3DHitDetail|null
});

• Surface3DHitDetail

  Type definition

selectionChanged

CustomEvent.detail type: Surface3DSelectionChangeEventDetail. Event names are case-sensitive.

Event name: selectionChanged. Names are case-sensitive. Read the payload from detail on CustomEvent<Surface3DSelectionChangeEventDetail>.

chart.addEventListener('selectionChanged', event => {
  console.log(event.detail); // Surface3DSelectionChangeEventDetail
});

• Surface3DSelectionChangeEventDetail

  Type definition

pointContextMenu

CustomEvent.detail type: ChartPointContextMenuEventDetail<Surface3DHitDetail>. Event names are case-sensitive.

Event name: pointContextMenu. Names are case-sensitive. Read the payload from detail on CustomEvent<ChartPointContextMenuEventDetail<Surface3DHitDetail>>.

chart.addEventListener('pointContextMenu', event => {
  console.log(event.detail); // ChartPointContextMenuEventDetail<Surface3DHitDetail>
});

• ChartPointContextMenuEventDetail

  Type definition

• Surface3DHitDetail

  Type definition

cameraChange

CustomEvent.detail type: Surface3DCameraChangeEventDetail. Event names are case-sensitive.

Event name: cameraChange. Names are case-sensitive. Read the payload from detail on CustomEvent<Surface3DCameraChangeEventDetail>.

chart.addEventListener('cameraChange', event => {
  console.log(event.detail); // Surface3DCameraChangeEventDetail
});

• Surface3DCameraChangeEventDetail

  Type definition

crosshairMove

CustomEvent.detail type: Surface3DCrosshairDetail|null. Event names are case-sensitive.

Event name: crosshairMove. Names are case-sensitive. Read the payload from detail on CustomEvent<Surface3DCrosshairDetail|null>.

chart.addEventListener('crosshairMove', event => {
  console.log(event.detail); // Surface3DCrosshairDetail|null
});

• Surface3DCrosshairDetail

  Type definition

appended

CustomEvent.detail type: {count:number;replaced:number}. Event names are case-sensitive.

Event name: appended. Names are case-sensitive. Read the payload from detail on CustomEvent<{count:number;replaced:number}>.

chart.addEventListener('appended', event => {
  console.log(event.detail); // {count:number;replaced:number}
});

windowSlid

CustomEvent.detail type: {dropped:number}. Event names are case-sensitive.

Event name: windowSlid. Names are case-sensitive. Read the payload from detail on CustomEvent<{dropped:number}>.

chart.addEventListener('windowSlid', event => {
  console.log(event.detail); // {dropped:number}
});

tooltipShow

Whether to display the built-in tooltip.

Event name: tooltipShow. Names are case-sensitive. Read the payload from detail on CustomEvent<CartesianTooltipEventDetail>.

chart.addEventListener('tooltipShow', event => {
  console.log(event.detail); // CartesianTooltipEventDetail
});

• CartesianTooltipEventDetail

  Type definition

tooltipHide

CustomEvent.detail type: void. Event names are case-sensitive.

Event name: tooltipHide. Names are case-sensitive. Read the payload from detail on CustomEvent<void>.

chart.addEventListener('tooltipHide', event => {
  console.log(event.detail); // void
});

tooltipAction

CustomEvent.detail type: CartesianTooltipActionEventDetail. Event names are case-sensitive.

Event name: tooltipAction. Names are case-sensitive. Read the payload from detail on CustomEvent<CartesianTooltipActionEventDetail>.

chart.addEventListener('tooltipAction', event => {
  console.log(event.detail); // CartesianTooltipActionEventDetail
});

• CartesianTooltipActionEventDetail

  Type definition

chartAnimationStart

CustomEvent.detail type: void. Event names are case-sensitive.

Event name: chartAnimationStart. Names are case-sensitive. Read the payload from detail on CustomEvent<void>.

chart.addEventListener('chartAnimationStart', event => {
  console.log(event.detail); // void
});

chartAnimationEnd

CustomEvent.detail type: void. Event names are case-sensitive.

Event name: chartAnimationEnd. Names are case-sensitive. Read the payload from detail on CustomEvent<void>.

chart.addEventListener('chartAnimationEnd', event => {
  console.log(event.detail); // void
});

chartAnimationInterrupted

CustomEvent.detail type: void. Event names are case-sensitive.

Event name: chartAnimationInterrupted. Names are case-sensitive. Read the payload from detail on CustomEvent<void>.

chart.addEventListener('chartAnimationInterrupted', event => {
  console.log(event.detail); // void
});

dataValidationError

CustomEvent.detail type: {message:string}. Event names are case-sensitive.

Event name: dataValidationError. Names are case-sensitive. Read the payload from detail on CustomEvent<{message:string}>.

chart.addEventListener('dataValidationError', event => {
  console.log(event.detail); // {message:string}
});

appendPoint

Append one value to the stream. Check the argument type and the licensing requirements for streaming.

appendPoint(row: Surface3DRowInput): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

• Surface3DRowInput

  Type definition

appendPoints

An asynchronous method. Check the argument and return types below.

appendPoints(rows: ReadonlyArray<Surface3DRowInput>): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

• Surface3DRowInput

  Type definition

appendBatch

Append multiple values to the stream. Check the argument type and the licensing requirements for streaming.

appendBatch(rows: ReadonlyArray<Surface3DRowInput>): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

• Surface3DRowInput

  Type definition

shiftPoints

An asynchronous method. Check the argument and return types below.

shiftPoints(count: number): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

shift

Drop the oldest streamed categories (the data boxes are not the stream).

shift(count: number): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

clearStream

An asynchronous method. Check the argument and return types below.

clearStream(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

replace

Swap the streamed set (replace([]) clears it); the base values never leave. Without chart.streaming the dies upsert into the base like a batch (quietly: no appended, no binChanged, as a ring replace).

replace(rows: ReadonlyArray<Surface3DRowInput>): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

• Surface3DRowInput

  Type definition

getStreamSource

The stream session's source (Chart Pro): like the stream methods it waits for a license still being confirmed.

getStreamSource(): Promise<Surface3DStreamSource|undefined>

Return type: Promise<Surface3DStreamSource|undefined>. Call the method after element registration and await its Promise result.

• Surface3DStreamSource

  Type definition

setData

Replace the bar set.

setData(data: Surface3DData): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

• Surface3DData

  Type definition

getData

An asynchronous method. Check the argument and return types below.

getData(): Promise<Surface3DGrid>

Return type: Promise<Surface3DGrid>. Call the method after element registration and await its Promise result.

• Surface3DGrid

  Type definition

getDiagnostics

Normalization diagnostics for the effective base and stream source.

getDiagnostics(): Promise<{ missingHeights: number; invalidHeights: number; missingValues: number; invalidValues: number; }>

Return type: Promise<{ missingHeights: number; invalidHeights: number; missingValues: number; invalidValues: number; }>. Call the method after element registration and await its Promise result.

getLayout

Host-local geometry as shown. Scale fields preserve ellipses under non-uniform viewport zoom.

getLayout(): Promise<Surface3DGeometry>

Return type: Promise<Surface3DGeometry>. Call the method after element registration and await its Promise result.

• Surface3DGeometry

  Type definition

pauseAnimation

Pause the current animation.

pauseAnimation(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

resumeAnimation

Resume a paused animation.

resumeAnimation(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

setAnimation

An asynchronous method. Check the argument and return types below.

setAnimation(options: {enabled?:boolean;duration?:number;easing?:Surface3DEasing;type?:HeatmapAnimationType}): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

• Surface3DEasing

  Type definition

• HeatmapAnimationType

  Type definition

replayAnimation

Replay the initial sweep from min → value(s). No-op when animation is off / reduced.

replayAnimation(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

getCamera

An asynchronous method. Check the argument and return types below.

getCamera(): Promise<Scene3DCameraOptions>

Return type: Promise<Scene3DCameraOptions>. Call the method after element registration and await its Promise result.

• Scene3DCameraOptions

  Type definition

setCamera

An asynchronous method. Check the argument and return types below.

setCamera(options: Scene3DCameraOptions): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

• Scene3DCameraOptions

  Type definition

setProjection

An asynchronous method. Check the argument and return types below.

setProjection(projection: Scene3DProjection): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

• Scene3DProjection

  Type definition

resetCamera

An asynchronous method. Check the argument and return types below.

resetCamera(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

saveCamera

An asynchronous method. Check the argument and return types below.

saveCamera(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

fitSurface

An asynchronous method. Check the argument and return types below.

fitSurface(padding?: number): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

zoomBy

A factor below one moves closer. Perspective changes distance; orthographic changes zoom.

zoomBy(factor: number): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

rotateBy

An asynchronous method. Check the argument and return types below.

rotateBy(azimuth: number, polar?: number): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

panBy

slide the zoomed windows by data units ({ x?, y? }); a no-op at the full extent.

panBy(x: number, y: number): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

resetZoom

Reset the zoomed or panned range to the original data range.

resetZoom(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

redraw

Redraw the chart using its current data and options. Inspect the rendered result after the returned Promise resolves.

redraw(): Promise<Surface3DRenderResult>

Return type: Promise<Surface3DRenderResult>. Call the method after element registration and await its Promise result.

• Surface3DRenderResult

  Type definition

getActiveTier

An asynchronous method. Check the argument and return types below.

getActiveTier(): Promise<Surface3DEngineTier>

Return type: Promise<Surface3DEngineTier>. Call the method after element registration and await its Promise result.

• Surface3DEngineTier

  Type definition

getUnavailableReason

Why the WebGPU renderer could not run (the fallback notice's reason); undefined when nothing fell back.

getUnavailableReason(): Promise<string|undefined>

Return type: Promise<string|undefined>. Call the method after element registration and await its Promise result.

getEngineStatus

Requested engine vs what runs, and why (CHART-ADD-08); a frozen or unlicensed chart reports the license outcome.

getEngineStatus(): Promise<ChartEngineStatus>

Return type: Promise<ChartEngineStatus>. Call the method after element registration and await its Promise result.

• ChartEngineStatus

  Type definition

recycleGpu

Without the grant (or while frozen) nothing is recycled: no GPU work starts.

recycleGpu(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

hitTest

The box under a host-local CSS point (the nearest slot, within half a pitch), or null.

hitTest(cssX: number, cssY: number): Promise<Surface3DHitDetail|null>

Return type: Promise<Surface3DHitDetail|null>. Call the method after element registration and await its Promise result.

• Surface3DHitDetail

  Type definition

selectPointAt

An asynchronous method. Check the argument and return types below.

selectPointAt(row: number, column: number): Promise<Surface3DHitDetail|null>

Return type: Promise<Surface3DHitDetail|null>. Call the method after element registration and await its Promise result.

• Surface3DHitDetail

  Type definition

clearSelection

Release the selection (emits selectionChanged when there was one).

clearSelection(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

getSelection

The selection: the selected node's / link's detail (null = none); its anchors are Pro-derived, refused without a valid license.

getSelection(): Promise<Surface3DSelection>

Return type: Promise<Surface3DSelection>. Call the method after element registration and await its Promise result.

• Surface3DSelection

  Type definition

showTooltipAtPoint

Open the tooltip for a dot programmatically. pointIndex is the category (row) index; the optional seriesIndex selects a group within that row (defaults to the first visible group's dot in the row). Returns the emitted tooltip detail, or null when no dot resolves / the tooltip is disabled.

showTooltipAtPoint(row: number, column: number): Promise<CartesianTooltipEventDetail|null>

Return type: Promise<CartesianTooltipEventDetail|null>. Call the method after element registration and await its Promise result.

• CartesianTooltipEventDetail

  Type definition

showTooltipAtIndex

open the tooltip on a box (the facade's showTooltipAtPoint routes here); null off the boxes or with the tooltip off.

showTooltipAtIndex(index: number): Promise<CartesianTooltipEventDetail|null>

Return type: Promise<CartesianTooltipEventDetail|null>. Call the method after element registration and await its Promise result.

• CartesianTooltipEventDetail

  Type definition

hideTooltip

Close the currently visible tooltip.

hideTooltip(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

showCrosshairAt

show the crosshair at a data position (a linked chart's cursor) without emitting crosshairMove; false when it falls outside the plot.

showCrosshairAt(row: number, column: number): Promise<boolean>

Return type: Promise<boolean>. Call the method after element registration and await its Promise result.

showCrosshairAtData

Quiet cross-chart synchronization in data units, including positions between grid samples.

showCrosshairAtData(request: CartesianCrosshairShowRequest): Promise<boolean>

Return type: Promise<boolean>. Call the method after element registration and await its Promise result.

• CartesianCrosshairShowRequest

  Type definition

hideCrosshair

hide the crosshair shown by showCrosshairAt (or the pointer's).

hideCrosshair(): Promise<void>

Return type: Promise<void>. Call the method after element registration and await its Promise result.

getDataTable

Current normalized table, including the retained stream; independent of GPU availability.

getDataTable(): Promise<ChartDataTable>

Return type: Promise<ChartDataTable>. Call the method after element registration and await its Promise result.

• ChartDataTable

  Type definition

getCSV

The tape as a CSV table (ISO time, OHLC, volume).

getCSV(options?: CsvOptions): Promise<string>

Return type: Promise<string>. Call the method after element registration and await its Promise result.

• CsvOptions

  Type definition

getTable

An asynchronous method. Check the argument and return types below.

getTable(): Promise<string>

Return type: Promise<string>. Call the method after element registration and await its Promise result.