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 "";
}
};
- Quyen Sy asked 1 year ago
- last edited 1 year ago
- You must login to post comments
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?
- Andrew Burnett-Thompson answered 1 year ago
- last edited 1 year ago
-
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?
-
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.
-
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 login to post comments
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?
- Andrew Burnett-Thompson answered 1 year ago
- last edited 1 year ago
-
Thank you for your explanation! It’s helpful.
-
Glad to be of help!
- You must login to post comments
Please login first to submit.