Home › Forums › Chart Support › CanvasJS npm package for React › Reply To: CanvasJS npm package for React
@allie,
Please download this sample project for integrating CanvasJS in React+Webpack.
For integrating CanvasJS in React please refer to the below code snippet –
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') );
Also, kindly take a look at this JSFiddle for a working sample.
___________ Indranil Deo Team CanvasJS