React Base Fiddle (JSX)

Starting point for creating JSFiddles with React. This uses React with Addons.

by Guillaume Seguin

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.8.24/browser.js"></script>
<script src="https://npmcdn.com/react@latest/dist/react-with-addons.js"></script>
<script src="https://npmcdn.com/react-dom@latest/dist/react-dom.js"></script>
<script src="https://code.highcharts.com/highcharts.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-highcharts/11.0.0/ReactHighcharts.js"></script>
<script src="https://facebook.github.io/react/js/jsfiddle-integration-babel.js"></script>

<div id="container">
  <!-- This element's contents will be replaced with your component. -->
</div>

JavaScript 1.7

var config = {
    title: { text: "Hello, World!" },
    xAxis: { categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"] },
  series: [{
    data: [39.9, 81.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4],
  }],
};

var config = {
    title: { text: "Hello, World 2!" },
    xAxis: { categories: ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"] },
  series: [{
    data: [20.9, 30.5, 30.4, 40.2, 50.0, 60.0, 10.6, 30.5, 50.4, 70.1, 100.6, 50.4],
  }],
};



ReactDOM.render(
		<div>
      <ReactHighcharts config={config} />
      <ReactHighcharts config={config2} />
    </div>,
    document.getElementById("container")
);