0

我正在使用 LightningChartJs vs 2.0.1，我正在尝试使用 pointSeries 创建一个 chartXY。

这是我拥有的反应组件的一部分

const MyFontSettings = new FontSettings({ size: 12 });
const MytickStyle = new VisibleTicks({
  labelFillStyle: new SolidFill({
    color: ColorHEX("#000"),
    tickLength: 8,
  }),
  gridStrokeStyle: new SolidFill({
    color: ColorHEX("#FFF"),
  }),
  gridStrokeLength: 0,
});
const chart = lightningChart().ChartXY({ container: "Mycontainer" });
chart
  .setTitle("My plot")
  .setTitleFillStyle((solidFill) => solidFill.setColor(ColorHEX("#000")))
  .setTitleMarginTop(0)
  .setTitleMarginBottom(0)
  .setChartBackgroundFillStyle((solidFill) =>
    solidFill.setColor(ColorHEX("#FFF"))
  )
  .setBackgroundFillStyle((solidFill) =>
    solidFill.setColor(ColorHEX("#FFF"))
  )
  .setZoomingRectangleStrokeStyle(
    new SolidLine({
      fillStyle: new SolidFill({ color: ColorHEX("#000") }),
    })
  )
  .setTitleFont(MyFontSettings)
  .setMouseInteractions(false);
// .setAutoCursorMode(AutoCursorModes.disabled);
// Configure X-axis of chart to be progressive and have nice interval.
chart
  .getDefaultAxisX()
  .setTickStrategy(AxisTickStrategies.Numeric, (styler) =>
    styler.setMajorTickStyle(MytickStyle).setMinorTickStyle(MytickStyle)
  )
  .setNibStyle(emptyLine)
  .setTitle("RR(n) ms")
  .setTitleFont(MyFontSettings);
chart
  .getDefaultAxisY()
  .setTickStrategy(AxisTickStrategies.Numeric, (styler) =>
    styler.setMajorTickStyle(MytickStyle).setMinorTickStyle(MytickStyle)
  )
  .setNibStyle(emptyLine)
  .setTitle("RR(n-1) ms")
  .setTitleFont(MyFontSettings);
let pointSeries = chart
  .addPointSeries()
  .setPointSize(50)
  .setPointFillStyle(new SolidFill({ color: ColorHEX("#14ADF4") }));
let arr = [];
axios
  .get(`${base_url}/api/myplot/${props.selected.entity}`)
  .then((res) => {
    arr = res.data;
  })
  .catch((err) => console.log(err));
setTimeout(() => {
  for (let point of arr) {
    pointSeries.add(point);
  }
}, 3000);

我可以确认当我将鼠标悬停在图表上时添加了点自动光标突出显示了点，但我看不到它们

4

0 回答 0