sy-geo-map

Geo Map

Show geographic locations and magnitudes on a map.

sy-geo-map

Explore the distribution of cities, facilities, or observation sites.

Check the longitude and latitude order. Projection affects the representation of distances and areas.

Base chart tier: Pro. Features such as additional renderers and custom branding have separate entitlement requirements.

InputData description
dataAn array of { longitude, latitude, value?, label? }.
projectionHow geographic coordinates project onto the screen.
mapRegionThe region shown initially.

Complete implementation example

html
<div id="chart-container" style="width: 100%; min-width: 0;"></div>

<script type="module">
  import { defineCustomElement as define0 } from '@syidax/advanced-pro/components/sy-geo-map.js';
  define0();

  // Pro: complete registerLicense at app startup using your issued certificate.
  // The website preview certificate is not for use in customer apps.
  const specs = [
    {
      "id": "example-chart",
      "tag": "sy-geo-map",
      "props": {
        "data": [
          {
            "id": "seoul",
            "label": "Seoul",
            "longitude": 126.98,
            "latitude": 37.57,
            "value": 80
          },
          {
            "id": "tokyo",
            "label": "Tokyo",
            "longitude": 139.69,
            "latitude": 35.68,
            "value": 65
          },
          {
            "id": "taipei",
            "label": "Taipei",
            "longitude": 121.56,
            "latitude": 25.03,
            "value": 45
          },
          {
            "id": "singapore",
            "label": "Singapore",
            "longitude": 103.82,
            "latitude": 1.35,
            "value": 55
          }
        ],
        "mapRegion": "asia",
        "mapBackground": "natural-earth",
        "projection": "mercator",
        "nodeLabels": "show",
        "width": 640,
        "height": 360,
        "brandPosition": "bottom-right",
        "brandLogo": ""
      }
    }
  ];
  const container = document.querySelector('#chart-container');
  const elements = specs.map(({ tag, id, props }) => {
    const element = document.createElement(tag);
    element.id = id;
    Object.assign(element, props);
    element.setAttribute('aria-label', 'geo-map example chart');
    return element;
  });
  container.replaceChildren(...elements);
  const chart = elements.at(-1);
  const onEvent = event => {
    console.log('nodeClick', event.detail);
  };
  chart.addEventListener('nodeClick', onEvent);
  const observer = new ResizeObserver(([entry]) => {
    const width = Math.max(160, Math.floor(entry.contentRect.width));
    elements.forEach(element => { element.width = width; });
  });
  observer.observe(container);

  // In an SPA, call this function when the view is disposed.
  function disposeChart() {
    observer.disconnect();
    chart.removeEventListener('nodeClick', onEvent);
    container.replaceChildren();
  }
</script>

Properties

data

An array of { longitude, latitude, value?, label? }.

ItemValue
JavaScript propertydata
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeGeoMapData
Defaultundefined

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

features

Owned geographic polygons and great-circle LineStrings, below data points.

ItemValue
JavaScript propertyfeatures
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeGeoMapFeatureCollection
Defaultundefined

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

polygonColor

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

ItemValue
JavaScript propertypolygonColor
HTML attributepolygon-color
Typestring
Default'#0d9488'

polygonOpacity

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

ItemValue
JavaScript propertypolygonOpacity
HTML attributepolygon-opacity
Typenumber
Default0.7

connectionWidth

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

ItemValue
JavaScript propertyconnectionWidth
HTML attributeconnection-width
Typenumber
Default2

connectionColor

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

ItemValue
JavaScript propertyconnectionColor
HTML attributeconnection-color
Typestring
Default'#7c3aed'

connectionOpacity

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

ItemValue
JavaScript propertyconnectionOpacity
HTML attributeconnection-opacity
Typenumber
Default0.85

connectionPath

Surface great-circle arcs (default), or flat-map straight routes. On globes, straight lifts the equirectangular route onto the surface.

ItemValue
JavaScript propertyconnectionPath
HTML attributeconnection-path
TypeGeoMapConnectionPath
Default'great-circle'
Allowed valuesgreat-circle, straight

mapColorAxis

Choropleth: feature property to a shared color ramp and numeric legend.

ItemValue
JavaScript propertymapColorAxis
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeGeoMapColorAxisInput
Defaultundefined
Literals in the typeauto

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

mapBubble

Geographic bubbles encode point values by area; object options are property-bound.

ItemValue
JavaScript propertymapBubble
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeGeoMapBubbleInput
Defaultundefined

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

mapHeat

Bounded screen-space Gaussian density below connections and points.

ItemValue
JavaScript propertymapHeat
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeGeoMapHeatInput
Defaultundefined

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

mapLayers

Layer presentation masks; assign an object property. Hidden sources retain selection and pinned-card identity.

ItemValue
JavaScript propertymapLayers
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeGeoMapLayersInput
Defaultundefined

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

mapLegend

Native buttons for point, polygon, connection and heat visibility.

ItemValue
JavaScript propertymapLegend
HTML attributemap-legend
Typeboolean
Defaultfalse

mapLegendLayers

Optional ordered legend subset for geographic specializations; source layers stay intact.

ItemValue
JavaScript propertymapLegendLayers
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeReadonlyArray<GeoMapLayer>
Defaultundefined

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

mapLayerNames

Pass as a JavaScript property. type: Partial<Record<GeoMapLayer,string>>.

ItemValue
JavaScript propertymapLayerNames
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypePartial<Record<GeoMapLayer,string>>
Defaultundefined

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

width

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

ItemValue
JavaScript propertywidth
HTML attributewidth
Typenumber
Default900

height

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

ItemValue
JavaScript propertyheight
HTML attributeheight
Typenumber
Default400

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.

ItemValue
JavaScript propertybrandPosition
HTML attributebrand-position
Type'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'
Default'bottom-right'
Allowed valuestop-left, top-right, bottom-left, bottom-right

padding

Padding around the coordinate frame in CSS pixels.

ItemValue
JavaScript propertypadding
HTML attributepadding
Typenumber
Default16

projection

How geographic coordinates project onto the screen.

ItemValue
JavaScript propertyprojection
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeGeoMapProjection
Default'identity'
Literals in the typeidentity, mercator, equirectangular, albers, orthographic

mapRegion

The region shown initially.

ItemValue
JavaScript propertymapRegion
HTML attributemap-region
TypeGeoMapRegion
Default'world'
Allowed valuesworld, africa, asia, europe, north-america, south-america, oceania, antarctica

mapBackground

Bundled public-domain land/coastline data; no runtime map download or API key.

ItemValue
JavaScript propertymapBackground
HTML attributemap-background
TypeGeoMapBackground
Default'natural-earth'
Allowed valuesnone, natural-earth

mapFixed

Lock geographic dragging: flat maps wrap longitude inside a fixed frame; Albers/Orthographic rotate. Zoom is separate.

ItemValue
JavaScript propertymapFixed
HTML attributemap-fixed
Typeboolean
Defaultfalse

crosshair

Geographic crosshair. Bare attribute or {} uses defaults; an object prop or JSON attribute overrides options. Omit/remove the attribute to disable.

ItemValue
JavaScript propertycrosshair
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeCartesianCrosshairInput
Defaultundefined

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

crosshairSnapDistance

Point-center capture distance in CSS pixels when crosshair.snap is enabled; direct marker hits also snap.

ItemValue
JavaScript propertycrosshairSnapDistance
HTML attributecrosshair-snap-distance
Typenumber
Default12

nodeRadius

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

ItemValue
JavaScript propertynodeRadius
HTML attributenode-radius
Typenumber
Default5

color

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

ItemValue
JavaScript propertycolor
HTML attributecolor
Typestring
Default'auto'

activeColor

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

ItemValue
JavaScript propertyactiveColor
HTML attributeactive-color
Typestring
Default'#f59e0b'

inactiveOtherPoints

Dim other point/feature glyphs around the focused, hovered or selected source identity. Heat stays unchanged.

ItemValue
JavaScript propertyinactiveOtherPoints
HTML attributeinactive-other-points
Typeboolean
Defaultfalse

inactivePointOpacity

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

ItemValue
JavaScript propertyinactivePointOpacity
HTML attributeinactive-point-opacity
Typenumber
Default.2

nodeLabels

Allowed values: auto, show, hide. Default: 'auto'.

ItemValue
JavaScript propertynodeLabels
HTML attributenode-labels
TypeGeoMapLabelMode
Default'auto'
Allowed valuesauto, show, hide

featureLabels

Optional region and connection names, sharing point-label collision avoidance.

ItemValue
JavaScript propertyfeatureLabels
HTML attributefeature-labels
TypeGeoMapLabelMode
Default'hide'
Allowed valuesauto, show, hide

featureLabelValue

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

ItemValue
JavaScript propertyfeatureLabelValue
HTML attributefeature-label-value
Typeboolean
Defaultfalse

nodeLabelValue

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

ItemValue
JavaScript propertynodeLabelValue
HTML attributenode-label-value
Typeboolean
Defaultfalse

chartTitle

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

ItemValue
JavaScript propertychartTitle
HTML attributechart-title
Typestring
Defaultundefined

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.

ItemValue
JavaScript propertychartSubtitle
HTML attributechart-subtitle
Typestring
Defaultundefined

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

enableMouseTracking

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

ItemValue
JavaScript propertyenableMouseTracking
HTML attributeenable-mouse-tracking
Typeboolean
Defaulttrue

tooltip

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

ItemValue
JavaScript propertytooltip
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeCartesianTooltipInput
Defaultundefined
Literals in the typeauto, off

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

tooltipEnabled

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

ItemValue
JavaScript propertytooltipEnabled
HTML attributetooltip-show
Typeboolean
Defaulttrue

tooltipFormat

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

ItemValue
JavaScript propertytooltipFormat
HTML attributePass objects, arrays, and callbacks as JavaScript properties
Type(detail: GeoMapHitDetail) => string
Defaultundefined

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

featureTooltipFormat

Formats owned polygon/connection metadata; point tooltipFormat remains independent.

ItemValue
JavaScript propertyfeatureTooltipFormat
HTML attributePass objects, arrays, and callbacks as JavaScript properties
Type(detail:GeoMapFeatureHitDetail)=>string
Defaultundefined

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

animated

Whether to animate initial display and data changes.

ItemValue
JavaScript propertyanimated
HTML attributeanimate
Typeboolean
Defaultfalse

animationDuration

Animation duration in milliseconds.

ItemValue
JavaScript propertyanimationDuration
HTML attributeanimation-duration
Typenumber
Default600

animationEasing

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

ItemValue
JavaScript propertyanimationEasing
HTML attributeanimation-easing
TypeGeoMapEasing
Default'ease-out'
Allowed valueslinear, ease-out, ease-in, ease-in-out

animationType

Allowed values: initial, update. Default: undefined.

ItemValue
JavaScript propertyanimationType
HTML attributeanimation-type
TypeGeoMapAnimationType
Defaultundefined
Allowed valuesinitial, update

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

streamSource

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

ItemValue
JavaScript propertystreamSource
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeGeoMapStreamSource
Defaultundefined

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

streamMax

The maximum number of streaming data points to retain.

ItemValue
JavaScript propertystreamMax
HTML attributestream-max
Typenumber
Defaultundefined

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

streamWindow

The streaming data range to keep visible.

ItemValue
JavaScript propertystreamWindow
HTML attributestream-window
Typenumber
Defaultundefined

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

zoom

Settings for zooming and the visible range.

ItemValue
JavaScript propertyzoom
HTML attributePass objects, arrays, and callbacks as JavaScript properties
TypeCartesianZoomInput
Defaultundefined
Literals in the typeauto, off, true, false, x, y, xy, inside

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.

ItemValue
JavaScript propertyengine
HTML attributeengine
TypeGeoMapEngineMode
Default'auto'
Allowed valuesauto, standard, pro

unavailable

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

ItemValue
JavaScript propertyunavailable
HTML attributeunavailable
TypeGeoMapUnavailableBehaviour
Default'fallback'
Allowed valuesfallback, error

Events

rendered

Emits rendering results in detail when chart drawing completes.

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

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

nodeClick

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

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

javascript
chart.addEventListener('nodeClick', event => {
  console.log(event.detail); // GeoMapHitDetail
});

nodeHover

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

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

javascript
chart.addEventListener('nodeHover', event => {
  console.log(event.detail); // GeoMapHitDetail | null
});

featureClick

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

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

javascript
chart.addEventListener('featureClick', event => {
  console.log(event.detail); // GeoMapFeatureHitDetail
});

featureHover

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

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

javascript
chart.addEventListener('featureHover', event => {
  console.log(event.detail); // GeoMapFeatureHitDetail | null
});

featureSelectionChange

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

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

javascript
chart.addEventListener('featureSelectionChange', event => {
  console.log(event.detail); // GeoMapFeatureSelectionChangeEventDetail
});

selectionChanged

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

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

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

pointContextMenu

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

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

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

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 }>.

javascript
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 }>.

javascript
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>.

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

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>.

javascript
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>.

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

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>.

javascript
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>.

javascript
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>.

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

zoomChange

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

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

javascript
chart.addEventListener('zoomChange', event => {
  console.log(event.detail); // CartesianZoomChangeEventDetail
});

mapViewChange

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

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

javascript
chart.addEventListener('mapViewChange', event => {
  console.log(event.detail); // GeoMapViewChangeEventDetail
});

mapLayerChange

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

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

javascript
chart.addEventListener('mapLayerChange', event => {
  console.log(event.detail); // GeoMapLayerChangeEventDetail
});

crosshairMove

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

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

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

Methods

getMapLayers

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

typescript
getMapLayers(): Promise<GeoMapLayerDetail[]>

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

setMapLayerVisible

Immediately mask a layer without restarting active animations, rescaling or reframing. Unknown keys return null.

typescript
setMapLayerVisible(layer: GeoMapLayer, visible: boolean): Promise<GeoMapLayerDetail|null>
ArgumentsTypeRequired
layerGeoMapLayerRequired
visiblebooleanRequired

Return type: Promise<GeoMapLayerDetail|null>. 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.

typescript
redraw(): Promise<GeoMapRenderResult>

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

recycleGpu

Release and reacquire the shared GPU surface without resetting data, pins or geographic view. Without the grant (or while frozen) nothing is recycled: no GPU work starts.

typescript
recycleGpu(): Promise<void>

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

getConnections

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

typescript
getConnections(): Promise<GeoMapConnectionView[]>

Return type: Promise<GeoMapConnectionView[]>. 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.

typescript
getEngineStatus(): Promise<ChartEngineStatus>

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

getActiveTier

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

typescript
getActiveTier(): Promise<GeoMapEngineTier>

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

getUnavailableReason

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

typescript
getUnavailableReason(): Promise<string | undefined>

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

getMapAvailability

Owned current engine status. A Pro decision can be pending before asynchronous device initialization finishes.

typescript
getMapAvailability(): Promise<GeoMapAvailabilityDetail>

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

setData

Replace the bar set.

typescript
setData(data: GeoMapData): Promise<void>
ArgumentsTypeRequired
dataGeoMapDataRequired

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

setFeatures

Validate atomically; invalid input rejects and leaves the previous layer intact.

typescript
setFeatures(features?: GeoMapFeatureCollection): Promise<void>
ArgumentsTypeRequired
featuresGeoMapFeatureCollectionOptional

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

getFeatures

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

typescript
getFeatures(): Promise<GeoMapFeatureCollection>

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

getMapColorAxis

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

typescript
getMapColorAxis(): Promise<GeoMapColorAxisDetail|null>

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

getFeatureSelection

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

typescript
getFeatureSelection(): Promise<GeoMapFeatureSelection>

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

selectFeatureAt

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

typescript
selectFeatureAt(index: number): Promise<GeoMapFeatureHitDetail | null>
ArgumentsTypeRequired
indexnumberRequired

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

showTooltipAtFeature

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

typescript
showTooltipAtFeature(index: number): Promise<CartesianTooltipEventDetail | null>
ArgumentsTypeRequired
indexnumberRequired

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

parseTopoJSON

Decode a Topology (object or JSON text) into owned GeoJSON; does not change chart data.

typescript
parseTopoJSON(input: unknown, objectName?: string): Promise<GeoMapFeatureCollection>
ArgumentsTypeRequired
inputunknownRequired
objectNamestringOptional

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

parseGeoJSON

Decode RFC 7946 Geometry, Feature or FeatureCollection into owned features without changing chart data.

typescript
parseGeoJSON(input: unknown): Promise<GeoMapFeatureCollection>
ArgumentsTypeRequired
inputunknownRequired

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

getNodes

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

typescript
getNodes(): Promise<GeoMapPoint[]>

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

getNode

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

typescript
getNode(index: number): Promise<GeoMapPoint | null>
ArgumentsTypeRequired
indexnumberRequired

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

getNodeById

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

typescript
getNodeById(id: string): Promise<GeoMapPoint | null>
ArgumentsTypeRequired
idstringRequired

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

getNodeCount

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

typescript
getNodeCount(): Promise<number>

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

getExtent

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

typescript
getExtent(): Promise<GeoMapExtent>

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

getMapDiagnostics

Current base input and active normalized stream window; not lifetime ingestion counters. Returns an owned snapshot.

typescript
getMapDiagnostics(): Promise<GeoMapDiagnostics>

Return type: Promise<GeoMapDiagnostics>. 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.

typescript
getLayout(): Promise<GeoMapLayoutResult>

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

appendPoint

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

typescript
appendPoint(node: GeoMapPointInput): Promise<void>
ArgumentsTypeRequired
nodeGeoMapPointInputRequired

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

appendBatch

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

typescript
appendBatch(nodes: ReadonlyArray<GeoMapPointInput>): Promise<void>
ArgumentsTypeRequired
nodesReadonlyArray<GeoMapPointInput>Required

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).

typescript
shift(count: number): Promise<void>
ArgumentsTypeRequired
countnumberRequired

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).

typescript
replace(nodes: ReadonlyArray<GeoMapPointInput>): Promise<void>
ArgumentsTypeRequired
nodesReadonlyArray<GeoMapPointInput>Required

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

getStreamSource

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

typescript
getStreamSource(): Promise<GeoMapStreamSource | undefined>

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

pauseAnimation

Pause the current animation.

typescript
pauseAnimation(): Promise<void>

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

resumeAnimation

Resume a paused animation.

typescript
resumeAnimation(): Promise<void>

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

replayAnimation

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

typescript
replayAnimation(): 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.

typescript
setAnimation(options: { enabled?: boolean; duration?: number; easing?: GeoMapEasing; type?: GeoMapAnimationType }): Promise<void>
ArgumentsTypeRequired
options{ enabled?: boolean; duration?: number; easing?: GeoMapEasing; type?: GeoMapAnimationType }Required

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.

typescript
hitTest(cssX: number, cssY: number): Promise<GeoMapPickDetail | null>
ArgumentsTypeRequired
cssXnumberRequired
cssYnumberRequired

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

selectNodeAt

Select (pin) a node: its neighbourhood stays highlighted after the pointer leaves; a negative or unknown index releases the selection. Emits selectionChanged when it changes.

typescript
selectNodeAt(index: number): Promise<GeoMapHitDetail | null>
ArgumentsTypeRequired
indexnumberRequired

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

clearSelection

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

typescript
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.

typescript
getSelection(): Promise<GeoMapSelection>

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

showTooltipAtIndex

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

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

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

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.

typescript
showTooltipAtPoint(index: number): Promise<CartesianTooltipEventDetail | null>
ArgumentsTypeRequired
indexnumberRequired

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

hideTooltip

Close the currently visible tooltip.

typescript
hideTooltip(): Promise<void>

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

zoomTo

Zoom to explicit windows over the unit extents: x / y as { min, max } or [min, max] (null clears that orientation).

typescript
zoomTo(request: CartesianZoomRequest): Promise<CartesianZoomChangeEventDetail | null>
ArgumentsTypeRequired
requestCartesianZoomRequestRequired

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

zoomBy

Scale the current windows by factor (< 1 zooms in) around anchorFraction (0..1, default centre).

typescript
zoomBy(factor: number, anchorFraction?: number): Promise<CartesianZoomChangeEventDetail | null>
ArgumentsTypeRequired
factornumberRequired
anchorFractionnumberOptional

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

panBy

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

typescript
panBy(delta: { x?: number; y?: number }): Promise<CartesianZoomChangeEventDetail | null>
ArgumentsTypeRequired
delta{ x?: number; y?: number }Required

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

resetZoom

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

typescript
resetZoom(): Promise<CartesianZoomChangeEventDetail | null>

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

resetMapView

Restore the configured projection/region and clear map movement and zoom.

typescript
resetMapView(): Promise<void>

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

getMapView

Owned geographic camera, effective region and viewport state.

typescript
getMapView(): Promise<GeoMapViewDetail>

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

fitMap

Fit current point/feature geometry with a uniform scale. Empty candidates leave the view unchanged.

typescript
fitMap(options?: GeoMapFitOptions): Promise<GeoMapFitDetail|null>
ArgumentsTypeRequired
optionsGeoMapFitOptionsOptional

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

getZoom

Read the current zoom range. Check the return type's nullability and the range for each axis.

typescript
getZoom(): Promise<CartesianZoomState | null>

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

getZoomExtent

The full extent (0 … 1) and key of the diagram's orientations (null before the first layout).

typescript
getZoomExtent(request?: CartesianZoomExtentRequest): Promise<CartesianZoomExtentDetail | null>
ArgumentsTypeRequired
requestCartesianZoomExtentRequestOptional

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

getDataTable

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

typescript
getDataTable(): Promise<ChartDataTable>

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

getLabels

the placed node labels in HOST-local CSS px as shown (the plot offset added; under a zoom the labels of the nodes outside the window are left out), shown or hidden with the reason.

typescript
getLabels(): Promise<GeoMapLabel[]>

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

getMapLabels

Full source text and current screen placement for both point and feature names.

typescript
getMapLabels(): Promise<GeoMapLabelView>

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

getMapHeat

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

typescript
getMapHeat(): Promise<GeoMapHeatDetail|null>

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

getMapHeatAt

Read aggregate density at a host-relative point; original point/feature selection remains separate.

typescript
getMapHeatAt(cssX: number, cssY: number): Promise<GeoMapHeatPointDetail|null>
ArgumentsTypeRequired
cssXnumberRequired
cssYnumberRequired

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

getMapHeatAtCoordinate

Read the current visible density at geography without requiring a source point or marker. Returns null for invalid, projection-clipped, offscreen or rear-hemisphere coordinates and hidden heat.

typescript
getMapHeatAtCoordinate(longitude: number, latitude: number): Promise<GeoMapHeatPointDetail|null>
ArgumentsTypeRequired
longitudenumberRequired
latitudenumberRequired

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

getMapBubbleScale

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

typescript
getMapBubbleScale(): Promise<GeoMapBubbleScaleDetail|null>

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

showCrosshairAtData

Quiet geographic synchronization; invalid, hidden or clipped coordinates leave no guide.

typescript
showCrosshairAtData(request: {dataX:number;dataY:number}): Promise<boolean>
ArgumentsTypeRequired
request{dataX:number;dataY:number}Required

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

hideCrosshair

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

typescript
hideCrosshair(): Promise<void>

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