Options
All
  • Public
  • Public/Protected
  • All
Menu
summary

A JavaScript Heatmap chart type rendering a 2-dimensional array of data as color values between X,Y bounds in SciChart's High Performance Real-time JavaScript Chart Library

description

Heatmaps are 2-dimensional arrays of data, rendered as a color-map on the chart. The UniformHeatmapRenderableSeries assumes the cells are equal size, and spaced along the X,Y axis according to properties on the UniformHeatmapDataSeries.

For a code sample how to initialize a uniform heatmap, see below

// Create an empty 2D array using the helper function zeroArray2D
const zValues: number[][] = zeroArray2D([height, width]);
// todo: fill the zValues 2d array with values

// Create a UniformHeatmapDataSeries passing in zValues
const heatmapDataSeries = new UniformHeatmapDataSeries(wasmContext, 0, 1, 0, 1, zValues);

// Create a Heatmap RenderableSeries with the color map. ColorMap.minimum/maximum defines the values in
// HeatmapDataSeries which correspond to gradient stops at 0..1
const heatmapSeries = new UniformHeatmapRenderableSeries(wasmContext, {
       dataSeries: heatmapDataSeries,
       colorMap: new HeatmapColorMap({
           minimum: 0,
          maximum: 200,
          gradientStops: [
              { offset: 0, color: "#00008B" },
              { offset: 0.2, color: "#6495ED" },
              { offset: 0.4, color: "#006400" },
              { offset: 0.6, color: "#7FFF00" },
              { offset: 0.8, color: "#FFFF00" },
              { offset: 1.0, color: "#FF0000" }
          ]
      })
  });

// Add heatmap to the chart
sciChartSurface.renderableSeries.add(heatmapSeries);

Hierarchy

Implements

Index

Constructors

Properties

Accessors

Methods

Constructors

constructor

Properties

Protected animationFSM

Protected animationQueue

animationQueue: SeriesAnimation[] = []

Protected currentRenderPassData

currentRenderPassData: RenderPassData

Protected dataLabelProviderProperty

dataLabelProviderProperty: BaseDataLabelProvider

Protected dataSeriesProperty

dataSeriesProperty: IDataSeries

hitTestProvider

hitTestProvider: IHitTestProvider

Gets the current IHitTestProvider, used to call methods IHitTestProvider.hitTest, IHitTestProvider.hitTestXSlice and IHitTestProvider.hitTestDataPoint and provide info about the series data-points at mouse or touch locations

hovered

hovered: EventHandler<SeriesHoveredArgs> = new EventHandler<SeriesHoveredArgs>()

A hovered EventHandler. This event fires whenever the Series is hovered or unhovered by a mouse or pointer.

remarks

See EventHandler for how to subscribe

Readonly id

id: string

A unique Id for the IRenderableSeries

invalidateParentCallback

invalidateParentCallback: () => void

A callback which tells the parent SciChartSurface that it must be redrawn, e.g. when a property changes

Type declaration

    • (): void
    • Returns void

Readonly isStacked

isStacked: boolean

Returns true if the series is a stacked series or not

isVisibleChanged

isVisibleChanged: EventHandler<SeriesVisibleChangedArgs> = new EventHandler<SeriesVisibleChangedArgs>()

An isVisible changed EventHandler. This event fires whenever the Series isVisible changes.

remarks

See EventHandler for how to subscribe

Protected opacityProperty

opacityProperty: number = 1

Protected paletteProviderProperty

paletteProviderProperty: IPaletteProvider = DefaultPaletteProvider.createEmpty()

Protected pointSeries

Protected renderDataTransformProperty

renderDataTransformProperty: IRenderDataTransform

Protected resamplerHelper

resamplerHelper: ExtremeResamplerHelper

Protected resamplingParams

resamplingParams: ResamplingParams

Readonly rolloverModifierProps

rolloverModifierProps: RolloverModifierRenderableSeriesProps = new RolloverModifierRenderableSeriesProps(this)

Readonly rolloverModifierProps1

rolloverModifierProps1: RolloverModifierRenderableSeriesProps = new RolloverModifierRenderableSeriesProps(this, true)

Gets or sets RolloverModifierRenderableSeriesProps for RolloverModifier tooltips Is being used for Y1 tooltips for FastBandRenderableSeries

selected

selected: EventHandler<SeriesSelectedArgs> = new EventHandler<SeriesSelectedArgs>()

A selected EventHandler. This event fires whenever the Series is selected or deselected.

remarks

See EventHandler for how to subscribe

Protected transformedRenderPassData

transformedRenderPassData: RenderPassData

Readonly Abstract type

Returns the type of the series. See ESeriesType for a list of values

Protected typeMap

typeMap: Map<string, string> = new Map<string, string>()

Protected webAssemblyContext

webAssemblyContext: TSciChart

Accessors

animation

clipToYRange

  • get clipToYRange(): boolean
  • set clipToYRange(value: boolean): void
  • If true, the drawing will be clipped to the visibleRange of the associated Y Axis. This is only really relevant if you are using Stacked Y Axes and do not want the series to be drawn outside that axis range

    Returns boolean

  • If true, the drawing will be clipped to the visibleRange of the associated Y Axis. This is only really relevant if you are using Stacked Y Axes and do not want the series to be drawn outside that axis range

    Parameters

    • value: boolean

    Returns void

colorMap

  • Gets or sets the HeatmapColorMap, which maps heatmap z-values to colors

    Returns HeatmapColorMap

  • Gets or sets the HeatmapColorMap, which maps heatmap z-values to colors

    Parameters

    Returns void

dataLabelProvider

dataSeries

drawNaNAs

drawingProviders

effect

enableDrawingOptimisations

  • get enableDrawingOptimisations(): boolean
  • Readonly. When true, resampling modes are enabled for faster drawing performance.

    inheritdoc

    Returns boolean

fillValuesOutOfRange

  • get fillValuesOutOfRange(): boolean
  • set fillValuesOutOfRange(value: boolean): void
  • Gets or sets whether to fill cells with edge color if its value is outside of {@link colorMap.minimum} to {@link colorMap.maximum} range

    Returns boolean

  • Gets or sets whether to fill cells with edge color if its value is outside of {@link colorMap.minimum} to {@link colorMap.maximum} range

    Parameters

    • value: boolean

    Returns void

isDigitalLine

  • get isDigitalLine(): boolean
  • set isDigitalLine(isDigitalLine: boolean): void
  • When true, if this series draws a line, the line will be a digital (step) line

    inheritdoc

    Returns boolean

  • When true, if this series draws a line, the line will be a digital (step) line

    inheritdoc

    Parameters

    • isDigitalLine: boolean

    Returns void

isHovered

  • get isHovered(): boolean
  • set isHovered(isHovered: boolean): void
  • Gets or sets whether the Series is hovered by a mouse or pointer device. Setting programmatically will trigger hovered logic

    inheritdoc

    Returns boolean

  • Gets or sets whether the Series is hovered by a mouse or pointer device. Setting programmatically will trigger hovered logic

    inheritdoc

    Parameters

    • isHovered: boolean

    Returns void

isRunningAnimation

  • get isRunningAnimation(): boolean

isRunningDataAnimation

  • get isRunningDataAnimation(): boolean

isSelected

  • get isSelected(): boolean
  • set isSelected(isSelected: boolean): void
  • Gets or sets whether the Series is selected. Setting programmatically will trigger selection logic

    inheritdoc

    Returns boolean

  • Gets or sets whether the Series is selected. Setting programmatically will trigger selection logic

    inheritdoc

    Parameters

    • isSelected: boolean

    Returns void

isSpline

  • get isSpline(): boolean
  • Returns true if the series uses spline interpolation

    inheritdoc

    Returns boolean

isVisible

  • get isVisible(): boolean
  • set isVisible(isVisible: boolean): void
  • When true, the series is visible and drawn

    inheritdoc

    Returns boolean

  • When true, the series is visible and drawn

    inheritdoc

    Parameters

    • isVisible: boolean

    Returns void

opacity

  • get opacity(): number
  • set opacity(value: number): void
  • An Opacity factor of the Series that controls its semi-transparency level, where value 1 means the Series is opaque; 0 - transparent.

    inheritdoc

    Returns number

  • An Opacity factor of the Series that controls its semi-transparency level, where value 1 means the Series is opaque; 0 - transparent.

    inheritdoc

    Parameters

    • value: number

    Returns void

paletteProvider

parentSurface

pointMarker

  • A Point Marker which is used to draw an optional point-marker at each data-point. Applicable to some series types only

    inheritdoc

    Returns IPointMarker | undefined

  • A Point Marker which is used to draw an optional point-marker at each data-point. Applicable to some series types only

    inheritdoc

    Parameters

    Returns void

renderDataTransform

resamplingMode

resamplingPrecision

  • get resamplingPrecision(): number
  • set resamplingPrecision(value: number): void
  • Gets or sets the resampling precision for this series.

    Default value is 0.0. Value of 1.0 means double precision: the resampler outputs 2x the number of points. Value of 2.0 means quadruple precision: the resampler outputs 4x the number of points.

    If experiencing visual artefacts, try setting the precision to 1.0 or 2.0. This will come at a minor performance cost of around 20% for large datasets.

    inheritdoc

    Returns number

  • Gets or sets the resampling precision for this series.

    Default value is 0.0. Value of 1.0 means double precision: the resampler outputs 2x the number of points. Value of 2.0 means quadruple precision: the resampler outputs 4x the number of points.

    If experiencing visual artefacts, try setting the precision to 1.0 or 2.0. This will come at a minor performance cost of around 20% for large datasets.

    inheritdoc

    Parameters

    • value: number

    Returns void

stroke

  • get stroke(): string
  • set stroke(htmlColorCode: string): void
  • A Stroke for lines, outlines and edges of this RenderableSeries

    inheritdoc

    Returns string

  • A Stroke for lines, outlines and edges of this RenderableSeries

    inheritdoc

    Parameters

    • htmlColorCode: string

    Returns void

strokeThickness

  • get strokeThickness(): number
  • set strokeThickness(value: number): void
  • The Stroke Thickness for lines, outlines and edges of this RenderableSeries

    inheritdoc

    Returns number

  • The Stroke Thickness for lines, outlines and edges of this RenderableSeries

    inheritdoc

    Parameters

    • value: number

    Returns void

supportsResampling

  • get supportsResampling(): boolean

useLinearTextureFiltering

  • get useLinearTextureFiltering(): boolean
  • set useLinearTextureFiltering(value: boolean): void
  • Gets or sets whether to make the heatmap linearly interpolated or smoothed between cells

    Returns boolean

  • Gets or sets whether to make the heatmap linearly interpolated or smoothed between cells

    Parameters

    • value: boolean

    Returns void

xAxis

xAxisId

  • get xAxisId(): string
  • set xAxisId(id: string): void
  • inheritdoc

    Returns string

  • inheritdoc

    Parameters

    • id: string

    Returns void

yAxis

yAxisId

  • get yAxisId(): string
  • set yAxisId(id: string): void
  • inheritdoc

    Returns string

  • inheritdoc

    Parameters

    • id: string

    Returns void

yRangeMode

  • Determines whether the y range for this series should consider only the visible data (the default), or include the drawn points just outside the visible range

    inheritdoc

    Returns EYRangeMode

  • Determines whether the y range for this series should consider only the visible data (the default), or include the drawn points just outside the visible range

    Parameters

    Returns void

zLabelProvider

  • Returns LabelProvider

  • Parameters

    Returns void

Methods

adjustAutoColor

  • adjustAutoColor(propertyName: string, color: string): string

Protected afterAnimationComplete

  • afterAnimationComplete(): void

applyTheme

Protected beforeAnimationStart

  • beforeAnimationStart(): void

checkIsOutOfDataRange

  • checkIsOutOfDataRange(xValue: number, yValue: number): boolean

Protected colorMapPropertyChanged

Protected dataSeriesDataChanged

delete

  • delete(): void

draw

enqueueAnimation

getCurrentRenderPassData

getDataPointWidth

getDataSeriesName

  • getDataSeriesName(): string

getDataSeriesValuesCount

  • getDataSeriesValuesCount(): number

getIndicesRange

getNativeXValues

  • getNativeXValues(): SCRTDoubleVector

getNativeYValues

  • getNativeYValues(): SCRTDoubleVector

Protected getResampledPointSeries

  • getResampledPointSeries(isXCategoryAxis?: boolean): IPointSeries

getResamplingParams

getSeriesInfo

getXRange

getYRange

hasDataSeries

  • hasDataSeries(): boolean

hasDataSeriesValues

  • hasDataSeriesValues(): boolean

hasFillPaletteProvider

  • hasFillPaletteProvider(): boolean

hasPointMarkerPaletteProvider

  • hasPointMarkerPaletteProvider(): boolean

hasStrokePaletteProvider

  • hasStrokePaletteProvider(): boolean

Protected needsResampling

Protected Abstract newHitTestProvider

notifyPropertyChanged

  • notifyPropertyChanged(propertyName: string): void

onAnimate

  • onAnimate(timeElapsed: number): void

onAttach

onDetach

  • onDetach(): void

onDpiChanged

pushPalettedColors

resolveAutoColors

  • resolveAutoColors(index: number, maxSeries: number, theme: IThemeProvider): void

runAnimation

Protected setAnimationVectors

setCurrentRenderPassData

Protected setPaletteProvider

toJSON

toPointSeries

Protected updateAnimationProperties

Protected updateTransformedValues

Protected valueChanged

  • valueChanged(oldValue: any, newValue: any): boolean
  • Parameters

    • oldValue: any
    • newValue: any

    Returns boolean

Generated using TypeDoc