Questions

RenderableSeries Hit-Test is not working as expected. Some bugs on the the RenderableSeries Hit-Test. Distance between two points are less then its working most of the time and getting the isHit variable getting true. But the distance is high then the lines near to the point only getting the isHit true. I am attaching the image when the red marked area is working fine and the blue marked area not working.

pointMarker max and min values marker are cropped when autoRange is enabled. Check the attached image.

If the y axis values are same then the lines are not visible on the chart and the labels are also not visible on the chart. Can you draw the lines on the middle of the chart to get more visible?

async initTrack() {
  const { wasmContext, sciChartSurface } = await SciChartSurface.create(
    "chart" + this.element
  );
  sciChartSurface.xAxes.add(
    new NumericAxis(wasmContext, { axisAlignment: EAxisAlignment.Top })
  );
  sciChartSurface.yAxes.add(
    new NumericAxis(wasmContext, {
      axisAlignment: EAxisAlignment.Left
    })
  );

  const dataSeries = new XyDataSeries(wasmContext);
  for (let i = 0; i <= 1000; i++) {
    dataSeries.append(i, 10);
  }

  const rendSeries = new FastLineRenderableSeries(wasmContext, {
    dataSeries: dataSeries,
    strokeThickness: 1,
    stroke: "red"
  });
  sciChartSurface.renderableSeries.add(rendSeries);
  sciChartSurface.chartModifiers.add(cursorModifier);

  return { wasmContext, sciChartSurface };
}

I am getting a console error when using isVisible: false to the FastLineRenderableSeries or FastMountainRenderableSeries and CursorModifier together.

  const { wasmContext, sciChartSurface } = await SciChartSurface.create(
    "chart" + this.element
  );
  sciChartSurface.xAxes.add(
    new NumericAxis(wasmContext, { axisAlignment: EAxisAlignment.Top })
  );
  sciChartSurface.yAxes.add(
    new NumericAxis(wasmContext, {
      axisAlignment: EAxisAlignment.Left,
      growBy: new NumberRange(0.4, 0.4)
    })
  );

  const dataSeries = new XyDataSeries(wasmContext);
  const POINTS = 1000;
  const STEP = (3 * Math.PI) / POINTS;
  for (let i = 0; i <= 1000; i++) {
    const k = 1 - i / 2000;
    dataSeries.append(i, Math.sin(i * STEP) * k * 0.7);
  }

  const rendSeries = new FastLineRenderableSeries(wasmContext, {
    dataSeries: dataSeries,
    strokeThickness: 1,
    stroke: "red",
    isVisible: false
  });
  sciChartSurface.renderableSeries.add(rendSeries);
  // sciChartSurface.background = this.color;

  sciChartSurface.chartModifiers.add(
    new ZoomExtentsModifier(),
    new ZoomPanModifier(),
    new MouseWheelZoomModifier()
  );

  // Add CursorModifier behavior
  const cursorModifier = new CursorModifier({
    crosshairStroke: "#ff6600",
    crosshairStrokeThickness: 1,
    tooltipContainerBackground: "#000",
    tooltipTextStroke: "#ff6600",
    showTooltip: true,
    axisLabelsFill: "#b36200",
    axisLabelsStroke: "#fff"
  });
  sciChartSurface.chartModifiers.add(cursorModifier);

  sciChartSurface.zoomExtents();
  return { wasmContext, sciChartSurface };

I am getting a console error when using isVisible: false to the FastLineRenderableSeries or FastMountainRenderableSeries and CursorModifier together.

Multiple instances of sci chart any appearance changes reflecting on other instances. When I changed the background of one instance the same is reflected in the other instance. I have updated with createSingle to resolve this issue, But i am getting one alert when using createSingle.

On Vertical chart Label overlapping on smaller height. I have tried maxAutoTicks also and on the lower height, it’s getting one error. This error is occurring when the width is 0 sometimes. Can you please check this issues?

On the vertical chart custom tooltipSvgTemplate seriesInfo isHit returns false always. Its working fine on the normal chart. Can you please check this issue is on verticle chart.

Remove the white spaces on the chart when we using drawLabels: false. I am using multiple x-axes and no of x-axis increase the empty white space on the x-axis is also increasing.

Hello,
I am trying to make an annotation draggable. I tried setting the isEditable property to true, but nothing happened. I can’t find the right documentation for draggable annotations . My code for creating the Annotation it’s below:

sciChartSurface.annotations.add(new LineAnnotation({
    stroke: "#279B27", strokeThickness: 3,
    xCoordinateMode: ECoordinateMode.DataValue,
    x1: 0,
    x2: 0,
    yCoordinateMode: ECoordinateMode.Relative,
    y1: 0,
    y2: 1,
    isEditable: true,
}));

Some users have reported an error when importing SciChart.js into a TypeScript or JavaScript application:

TS1261: Already included file name ‘C:...\SciChartSurface.d.ts’ differs from file name ‘C:/…/node_modules/scichart/charting/
Visuals/Axis/SciChartSurface.d.ts’ only in casing.

Solution below…

The value of SciChart in Silverlight is the browser hosting capability. With Silveright on its way out, there appears to be no replacement for SciChart in a browser. However, there is a very good public domain project called Fayde that has re-implemented the Mono Moonlight code as Typescript. Fayde lets you port C#/XAML to Javascript surprisingly easily.

Have you looked at Fayde, and do you foresee a (possibly stripped-down) SciChart version for Fayde?

Fayde: https://wsick.github.io/Fayde/