0
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://code.highcharts.com/modules/exporting.js"></script>


<button onclick="build()">Click me</button>
<div id="container"></div>
<textarea id="chartCode" name="w3review" cols="30" rows="15" >
{
  series: [{
      data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
    }],    
    exporting: {
      sourceWidth: 900,
      sourceHeight: 400,
    }
    
  }
</textarea>
const chart = document.getElementById('chartCode').textContent


console.log(chart)
Highcharts.chart('container', chart);

I'm trying to make a simple page where you add this section of the highcharts code into the textarea and click build and the chart will build with the code you input. I think it has to do with .textContent being a string.

https://jsfiddle.net/b2p7nrLc/3/

I using other methods to build the chart but could not get it working

willk
  • 1
  • Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. – Community Nov 23 '22 at 08:52

1 Answers1

0

It's not working because the chart variable is a string and Highcharts requires to have a JS object to create a chart. You can keep the JSON strucutre and use the JSON.parse method:

Highcharts.chart('container', JSON.parse(chart));

Or use some other method to create an object: Converting a string to JSON object


Live example: https://jsfiddle.net/BlackLabel/89hmkqnf/

ppotaczek
  • 36,341
  • 2
  • 14
  • 24