Reactjs 如何将getSVG（）与react highcharts一起使用？

在开始构建函数之前，我尝试获取每个highchart的SVG字符串并将其记录到控制台

我认为我遇到的问题是调用getSVG（）的方式，但我不确定

我试过很多方法，但似乎都无法奏效

文档对此不是很清楚：

编辑：我在这里发现了一个类似的问题，但仍然无法使其正常工作：

import React，{Component}来自'React'；
从“react highcharts”导入RHC；
从“Highcharts”导入Highcharts；
导入highcharts从“highcharts/Module/exporting”导入；
Highcharts报告（Highcharts）；
const react Highcharts=带有Highcharts（Highcharts）的RHC；
类图扩展组件{
componentDidMount（）{
console.log（this.refs[this.props.name].getSVG（））；
}
render（）{
返回(
);
}
}
导出默认图表；

我得到了这个错误：

TypeError:this.refs[this.props.name].getSVG不是函数。（在'this.refs[this.props.name].getSVG（）'中，'this.refs[this.props.name].getSVG'未定义）

---

按照以下代码在您的系统中实施：

const ReactHighcharts = require('react-highcharts');

class MyComponent extends React.Component {
  componentDidMount() {
    let chart = this.refs.chart.getChart();
    let svg = chart.getSVG(); // This is your SVG
  }

  render() {
    return <ReactHighcharts config={config} ref="chart"/>;
  }
}

从“React”导入React；
从“highcharts react official”导入highcharts react；
从“海图/海图”导入海图；
从“海图/模块/导出”导入导出；
导出（高图）
类图扩展组件{
componentDidMount（）{
console.log（this.refs[chartRef].getSVG（））；
}
render（）{
返回(
);
}
}
导出默认图表；

---

在这里您可以访问getSVG。仅包括导出（高图）

您有解决方案吗？

const ReactHighcharts = require('react-highcharts');

class MyComponent extends React.Component {
  componentDidMount() {
    let chart = this.refs.chart.getChart();
    let svg = chart.getSVG(); // This is your SVG
  }

  render() {
    return <ReactHighcharts config={config} ref="chart"/>;
  }
}

componentDidUpdate() {
    if (this.refs.chart) {
        let chart = this.refs.chart.refs.chart;
        let html = document.createElement('html');
        html.innerHTML = chart.innerHTML;
        let svg = html.getElementsByTagName('svg')[0].outerHTML; // This is your SVG
    }
}

import React from 'react';
import HighchartsReact from 'highcharts-react-official';
import Highcharts from 'highcharts/highcharts';
import exporting from 'highcharts/modules/exporting';
exporting(Highcharts)

class Chart extends Component {

  componentDidMount() {
    console.log(this.refs[chartRef].getSVG());
  }

  render() {
    return (
      <HighchartsReact
         highcharts={Highcharts}
         options={...yourOptions}
         ref="chartRef"
      />);
   }
}

export default Chart;