Pre loader

Live updated y-axis (time) in a waterfall uniform heatmap

Welcome to the SciChart Forums!

  • Please read our Question Asking Guidelines for how to format a good question
  • Some reputation is required to post answers. Get up-voted to avoid the spam filter!
  • We welcome community answers and upvotes. Every Q&A improves SciChart for everyone

WPF Forums | JavaScript Forums | Android Forums | iOS Forums

0
0

I am trying to implement a waterfall chart with uniform heatmap. The data is updated from the top of the chart and keeps pushing the old data down. I would like to show the y-axis with time. How can I update the y-axis with updated data?

Assume the heatmap is 256 height, I created the zValues array with min value when draw the heatmap:

const SPECTROGRAM_WIDTH = 256; 
const minPower = -200;
spectrogramZValues.current = Array.from(Array(SPECTROGRAM_HEIGHT), () => Array(SPECTROGRAM_WIDTH).fill(minPower));

Update zValues array when new data come:

    spectrogramZValues.current.shift();
        spectrogramZValues.current.push(newData);

When the first data pushed to the chart. There will be one row shown in the axis with timestamp t1. When the second data comes, the top row of the y-axis should be t2 and the t1 is pushed down. When the waterfall chart is filled with 256 data, the bottom of the y-axis should be t1 and the top of the y-axis should be t256. Is it possible to implement this?

Now I am using the uniform heatmap to implement it with yStart=0 and yStep=1. I tried to add the labelProvider to the y-axis to show the timestamp of each row. I am keeping an array locally to store the timestamp of each row which will be updated with the new data. I tried to map this array and return the timestamp in the y-axis labelProvider. But it doesn’t work. The y-axis will not be refreshed when data updated.

        yAxis.labelProvider.formatLabel = (dataValue) => {
        const ts = timestampArray[dataValue];
        if (ts) {
            const timeObj = new Date(ts);
            const hours = ('0' + timeObj.getHours()).slice(-2);
            const minutes = ('0' + timeObj.getMinutes()).slice(-2);
            const seconds = ('0' + timeObj.getSeconds()).slice(-2);
            const milliseconds = ('0' + timeObj.getMilliseconds()).slice(-3);
            return `${hours}:${minutes}:${seconds}.${milliseconds}`;
        } else {
            return "";
        }
    };
Version
3.1.333
  • You must to post comments
1
0

I am considering applying server-side licensing for my javerScript application.

In the document below, there is a phrase “Our server-side licensing component is written in C++.”
(https://support.scichart.com/index.php?/Knowledgebase/Article/View/17256/42/)

However, there is only asp.net sample code on the provided github.
(https://github.com/ABTSoftware/SciChart.JS.Examples/tree/master/Sandbox/demo-dotnet-server-licensing)

I wonder if there is a sample code implemented in C++ for server-side licensing.

Can you provide c++ sample code?
Also, are there any examples to run on Ubuntu?

  • Quyen Sy
    Thank Andrew! Yes, I am trying to add a y-axis with time to a waterfall heatmap but found that it’s not easy. I will try to update the yAxis.visibleRange to see if it can solve my problem. I also tried to implement it with non-uniform heatmap as my timestamp of data is actually non-uniform. I tried to set the yCellOffsets to return timestamp. e.g. [1684331935746, 1684331936246, 1684331936746, ……]. But it’s failed to plot to the y-axis. Do you know what’s wrong?
  • Quyen Sy
    Could you show me example codes of your suggested way to update yAxis.visibleRange? The spectrogram height is fixed, I don’t understand how to fake Y axis.
  • Andrew Burnett-Thompson
    This really is the topic of a second forum question but a quick codepen here. See lines 23-29 https://codepen.io/scichart/pen/NWOexGL
  • You must to post comments
1
0

I am considering applying server-side licensing for my javerScript application.

In the document below, there is a phrase “Our server-side licensing component is written in C++.”
(https://support.scichart.com/index.php?/Knowledgebase/Article/View/17256/42/)

However, there is only asp.net sample code on the provided github.
(https://github.com/ABTSoftware/SciChart.JS.Examples/tree/master/Sandbox/demo-dotnet-server-licensing)

I wonder if there is a sample code implemented in C++ for server-side licensing.

Can you provide c++ sample code?
Also, are there any examples to run on Ubuntu?

  • You must to post comments
Showing 2 results
Your Answer

Please first to submit.