PHP Charts are responsive, are cross-browser compatible and runs across all the devices including Desktop, Tablets & Phones. The given example shows Responsive Chart along with PHP source code that you can try running locally.
<?php $dataPoints = array( array("label"=> "Education", "y"=> 284935), array("label"=> "Entertainment", "y"=> 256548), array("label"=> "Lifestyle", "y"=> 245214), array("label"=> "Business", "y"=> 233464), array("label"=> "Music & Audio", "y"=> 200285), array("label"=> "Personalization", "y"=> 194422), array("label"=> "Tools", "y"=> 180337), array("label"=> "Books & Reference", "y"=> 172340), array("label"=> "Travel & Local", "y"=> 118187), array("label"=> "Puzzle", "y"=> 107530) ); ?> <!DOCTYPE HTML> <html> <head> <script> window.onload = function () { var chart = new CanvasJS.Chart("chartContainer", { animationEnabled: true, theme: "light2", // "light1", "light2", "dark1", "dark2" title: { text: "Top 10 Google Play Categories - till 2017" }, axisY: { title: "Number of Apps" }, data: [{ type: "column", dataPoints: <?php echo json_encode($dataPoints, JSON_NUMERIC_CHECK); ?> }] }); chart.render(); } </script> </head> <body> <div id="chartContainer" style="height: 370px; width: 100%;"></div> <script src="https://cdn.canvasjs.com/canvasjs.min.js"></script> </body> </html>
You can change the theme of the chart using the theme property. Some other commonly used customizations include type, color, fillOpacity, etc.