Overlapping Bar Chart

Hi

You get this problem if you have bar charts with sparse data (ie not enough columns to fill the x axis). By default, SciChart calculates the column width by dividing the total axis length by the number of columns.

You can either adjust the dataPointWidth, or if you need things a bit more dynamic, you can override getDataPointWidth as shown below. Here I am calculating the width based on the gap between the first 2 points.

// Create an add a column series
  const colSeries = new FastColumnRenderableSeries(wasmContext, {
    dataSeries: new XyDataSeries(wasmContext, { xValues, yValues }),
    // Fill & stroke support Hex strings and rgba()
    fill: appTheme.PaleSkyBlue + "77",
    dataPointWidth: 0.8,
  });
  xValues.sort();
  colSeries.getDataPointWidth = (xCoordCalc, widthFraction) => {
    //return 25;
    const pointGap =
      xCoordCalc.getCoordinate(xValues[1]) -
      xCoordCalc.getCoordinate(xValues[0]);
    console.log(pointGap, widthFraction);
    return pointGap * widthFraction;
  };
  sciChartSurface.renderableSeries.add(colSeries);

Regards
David