Capturing Drawing Values from Technical Analysis with Annotations Chart in React about highcharts-react HOT 6 CLOSED

You can use almost the same logic, but in some navigation events. Please check the example below.

Live example: https://codesandbox.io/p/sandbox/highcharts-react-demo-forked-3hv7q6
API Reference: https://api.highcharts.com/highstock/navigation

from highcharts-react.

Hi @dogankablan,

You can use similar logic as the built-in save chart button in stock tools: https://github.com/highcharts/highcharts/blob/40735d878113ee1cc3c070c4bbe27356cf7a9b80/ts/Stock/StockTools/StockToolsBindings.ts#L1950

  const saveChartOptions = () => {
    if (chartComponent) {
      const chart = chartComponent.current.chart;
      const annotations = [],
        indicators = [],
        flags = [],
        yAxes = [];

      chart.annotations.forEach(function (annotation, index) {
        annotations[index] = annotation.userOptions;
      });
      chart.series.forEach(function (series) {
        if (series.is("sma")) {
          indicators.push(series.userOptions);
        } else if (series.type === "flags") {
          flags.push(series.userOptions);
        }
      });
      chart.yAxis.forEach(function (yAxis) {
        if (yAxis.userOptions.className !== "highcharts-navigator-yaxis") {
          yAxes.push(yAxis.options);
        }
      });

      setSavedChartOptions({
        annotations,
        indicators,
        flags,
        yAxes,
      });
    }
  };

Live example: https://codesandbox.io/p/sandbox/highcharts-react-demo-forked-rg43m7?file=%2Fdemo.jsx

Best regards!

from highcharts-react.

Thank you for your response.

I want to perform the registration process by detecting user events instead of using a button and record the registration on the state.

Is it possible for me to do this?

from highcharts-react.

@dogankablan, I am not quite sure what you want to achieve, so could you add more details to your question? What do you mean by user events?

from highcharts-react.

@ppotaczek what I mean by user events is the drawings made by the user using drawing tools. For example, when the user adds a flag, I want to transfer the values of the drawings made on the chart into the state. This applies to all stock tools. Currently, I trigger this recording process with a button. However, I want to trigger it based on the drawing actions the user takes and transfer them into the state, rather than triggering it with a button.

from highcharts-react.

Thank you for your support.

from highcharts-react.