Pre loader

How to insert gaps (no value) in heatmap


How do I insert gaps in a heatmap series? At the moment null values seem to show as either the max value colour or the min value colour.

  • Andrew Burnett-Thompson
    Hi Henrique, have you tried inserting double.NaN into the heatmap dataseries? This is designed to render a null (empty) cell. If this does not work let me know and I will report a bug.
  • You must to post comments
Best Answer

Hi Henrique,

We confirmed a bug – NaN values in heatmap vaules should render as transparent cells.

Can you get scichart v1.4.1611 and try this code please? You will need to set:

dataSeries.hasNaNs = true;

This is the example

export const drawExample2 = async () => {
    const { sciChartSurface, wasmContext } = await SciChartSurface.create(divElementId2);
    sciChartSurface.xAxes.add(new NumericAxis(wasmContext, { axisTitle: "Heatmap X" }));
        new NumericAxis(wasmContext, {
            axisTitle: "Heatmap Y",
            axisAlignment: EAxisAlignment.Left
    const gradientStops = [
        { offset: 0, color: "yellow" },
        { offset: 1, color: "red" }
    const colorMap = new HeatmapColorMap({
        minimum: 1,
        maximum: 9,
    const initialZValues = [
        [NaN, NaN, 1, 2],
        [2, 1, 2, 3]
    const dataSeries = new UniformHeatmapDataSeries(wasmContext, 0, 1, 3, 1, initialZValues);
    dataSeries.hasNaNs = true;
    const heatmapSeries = new UniformHeatmapRenderableSeries(wasmContext, {
        opacity: 0.5,
    sciChartSurface.chartModifiers.add(new MouseWheelZoomModifier());
    return { sciChartSurface, wasmContext };

Can you try that please?

Best regards,

  • Henrique Rodrigues
    Thanks Andrew, this seems to work. There is a separate issue with the later version of SciChart for which I will raise a separate question.
  • Andrew Burnett-Thompson
    Ok thanks!
  • You must to post comments
Showing 1 result
Your Answer

Please first to submit.

Try SciChart Today

Start a trial and discover why we are the choice
of demanding developers worldwide

Start TrialCase Studies