JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-with-addons.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.7/react-dom.js"></script>
<script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
<div id="root"></div>

Babel + JSX

class Chart extends React.Component {
    componentDidMount() {
        var chart = new CanvasJS.Chart("chartContainer", {
            animationEnabled: true,
            title:{
              text: "Basic Column Chart in React"
            },
            data: [
              {
                type: "column",
                dataPoints: [
                  { label: "apple",  y: 10  },
                  { label: "orange", y: 15  },
                  { label: "banana", y: 25  },
                  { label: "mango",  y: 30  },
                  { label: "grape",  y: 28  }
                ]
              }
            ]
        });
    chart.render();
  }
  render() {
    return (
      <div id="chartContainer" style={{height: 360 + "px", width: 100 + "%"}}>
      </div>
    );
  }
}

// ========================================

ReactDOM.render(
  <Chart />,
  document.getElementById('root')
);