Search code examples
javascriptscichartscichart.js

SciChart: Working with JavaScript Heatmap Chart


I am using SciChart Library for showing JS Heatmap Chart.

According to the below documentation, the zValues variable is generated using iterate function but when I try to use it in my HTML & CSS based website, Its not working.

https://demo.scichart.com/javascript-heatmap-chart

The error I am getting is:

Uncaught SyntaxError: Unexpected token ':'

I have written the following Code:

Code:

var {sciChartSurface, wasmContext} = await SciChart.SciChartSurface.create("line_chart_3");
// Add XAxis and YAxis
sciChartSurface.xAxes.add(new SciChart.NumericAxis(wasmContext));
sciChartSurface.yAxes.add(new SciChart.NumericAxis(wasmContext));
// Create a Heatmap Data-series. Pass heatValues as a number[][] to the UniformHeatmapDataSeries
var initialZValues: number[][] = iterate(WIDTH, HEIGHT, 200, 0, MAX_SERIES);
var heatmapDataSeries = new SciChart.UniformHeatmapDataSeries(wasmContext,
{
    xStart: 100,
    xStep: 1,
    yStart: 100,
    yStep: 1,
    zValues: initialZValues
});
// Create a Heatmap RenderableSeries with the color map. ColorMap.minimum/maximum defines the values in
// HeatmapDataSeries which correspond to gradient stops at 0..1
var heatmapSeries = new SciChart.UniformHeatmapRenderableSeries(wasmContext,
{
    dataSeries: heatmapDataSeries,
    colorMap: new SciChart.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" }
        ]
    })
});

The above code is arising error on: var initialZValues: number[][] = iterate(WIDTH, HEIGHT, 200, 0, MAX_SERIES);

Please help.


Solution

  • The following line of code is Typescript

     var initialZValues: number[][] = iterate(WIDTH, HEIGHT, 200, 0, MAX_SERIES);
    

    remove the : number[][] and it should run.