I am trying to add sci chart in nextjs app and its failing with a message “Aborted(both async and sync fetching of the wasm failed)”.
I have updated next config – webpack with :
const destWasmFolder = “static/chunks/pages”;
config.plugins.push(new CopyPlugin({
patterns: [
{ from: “node_modules/scichart/_wasm/scichart2d.wasm”, to: destWasmFolder },
]
And installed the package copy-files-from-to and created a file “copy-files-from-to.json in the root directory with content:
{
“copyFilesSettings”: {
“whenFileExists”: “overwrite”
},
“copyFiles”: [
{
“from”: “./node_modules/scichart/_wasm/scichart2d.data”,
“to”: “./public/scichart2d.data”
}
]
}
And updated package.json script with “”dev”: “cross-env NODE_OPTIONS=\”-r next-logger\” copy-files-from-to && next dev”
- Ajin Thankachen asked 3 months ago
- last active 1 month ago
I have a color heatmap legend that need to update the yAxis range on the fly. The colorMap doesn’t update as expected. Here’s my codes to update the y axis and colorMap min/max of the heatmap legend:
const newRange = new NumberRange(newMin, newMax);
const yAxis = heatmapLegendRef.current.sciChartSurface.yAxes.items[0];
yAxis.majorDelta = newScale;
yAxis.minorDelta = newScale / 5;
yAxis.visibleRange = newRange;
yAxis.visibleRangeLimit = newRange;
yAxis.zoomExtentsRange = newRange;
colorMapRef.current.minimum = newMin;
colorMapRef.current.maximum = newMax;
heatmapLegendRef.current.colorMap = colorMapRef.current;
The y axis range has been updated. But the colorMap didn’t. It seems that the colorMap of the heatmap legend cannot be changed. Is it true that I can only recreate the heatmap legend if I want to change the colorMap?
- Quyen Sy asked 11 months ago
- last active 11 months ago
I have a real time updated chart with very large data size and I am facing the slow client problem. i.e. The data sending speed is faster than the data receiving and handling speed which causes memory growing up issue. I am trying to use Web Workers to increase the data handling speed in frontend. I have found a related post:
https://www.scichart.com/questions/wpf/is-xydataseries-safe-to-being-changed-in-a-separate-thread
It seems possible to update XyDataSeries in the background thread with WPF. My UI is built with NextJS. I tried to use Web Workers to implement multiple threads. But I found that it can’t pass the SciChartSurface or XyDataSeries to the worker thread. Could you show me an example on how to update XyDataSeries in the worker thread with Web Workers?
- Quyen Sy asked 1 year ago
- last active 1 year ago
I recently upgraded SciChart from version 2 to version 3.0.266. It was working fine. But I got error (please refer to the attached screenshot) when I try to run my application today. It’s so strange as it worked fine yesterday and I didn’t make any codes change today.
- Quyen Sy asked 1 year ago
- last active 1 year ago
I am using NextJS with the SciChart trial license for development and suddenly got the error “SciChart: WebGL not supported! ” with Chrome. It worked fine before, and I didn’t change any codes for launching the chart. Also, it works fine with Firefox. The chrome version I am using is 107.0.5304.107.
BTW, the error is gone after I restarted my computer. Is it possible to be related to memory issue?
Below are my codes for initializing the chart:
const initSciChart = () => {
// LICENSING //
SciChartSurface.setRuntimeLicenseKey("xxx");
SciChartDefaults.enableResampling = true;
SciChartDefaults.asyncLabels = true;
SciChartDefaults.useSharedCache = true;
drawSpecChart();
};
async function drawSpecChart() {
// Create the SciChartSurface in the div 'scichart-root'
// The SciChartSurface, and webassembly context 'wasmContext' are paired. This wasmContext
// instance must be passed to other types that exist on the same surface.
let xAxesNumberRange = new NumberRange(0, 18);
let yAxesNumberRange = new NumberRange(-140, -40);
const chartDefinition = {
xAxes: [{
type: EAxisType.NumericAxis,
options: {
axisTitle: "Frequency (GHz)",
axisTitleStyle: {
fontSize: 12,
fontFamily: "sans-serif",
fontWeight: "bold"
},
labelStyle: {
fontSize: 12,
fontFamily: "sans-serif"
},
visibleRange: xAxesNumberRange,
zoomExtentsRange: xAxesNumberRange,
labelFormat: ENumericFormat.Decimal,
labelPrecision: 6,
cursorLabelFormat: ENumericFormat.Decimal,
cursorLabelPrecision: 6,
drawMajorBands: false,
}
}],
yAxes: [{
type: EAxisType.NumericAxis,
options: {
axisTitle: "Power (dBm)",
axisTitleStyle: {
fontSize: 12,
fontFamily: "sans-serif",
fontWeight: "bold"
},
labelStyle: {
fontSize: 12,
fontFamily: "sans-serif"
},
autoTicks: false,
majorDelta: 10,
minorDelta: 5,
axisAlignment: EAxisAlignment.Left,
visibleRange: yAxesNumberRange,
zoomExtentsRange: yAxesNumberRange,
labelFormat: ENumericFormat.Decimal,
labelPrecision: 2,
cursorLabelFormat: ENumericFormat.Decimal,
cursorLabelPrecision: 2,
drawMajorBands: false,
},
}],
series: [],
modifiers: [
{ type: EChart2DModifierType.MouseWheelZoom },
{
type: EChart2DModifierType.ZoomExtents,
options: {
isAnimated: false
}
}
]
};
const { sciChartSurface, wasmContext } = await chartBuilder.build2DChart("scichart-root", chartDefinition);
xAxesNumberRange = null;
yAxesNumberRange = null;
};
- Kelly Chan asked 2 years ago
- last active 2 years ago
