HTML Editor
<!DOCTYPE html> <html lang="en-US"> <head> <script src="https://www.gstatic.com/charts/loader.js"></script> </head> <body> <div id="point"> </div> <script> google.charts.load('current', {packages: ['corechart', 'bar']}); google.charts.setOnLoadCallback(drawDualX); function drawDualX() { var data = google.visualization.arrayToDataTable([ ['Companies', 'Facebook ', 'Youtube'], ['Honda', 6505000, 8008000], ['Hyundai', 6005000, 4008000], ['Kia', 2095000, 2196000], ['Jaguar', 5098100, 1003000], ['Toyota', 6105000, 5508000] ]); var options = { height:400, chart: { title: 'Car Companies - Advertising Statistics', subtitle: 'Based on Arpil 19 - Feb 20' }, hAxis: { title: 'Total Population' }, vAxis: { title: 'City' }, bars: 'horizontal', series: { 0: {axis: 'facebook'}, 1: {axis: 'youtube'} }, axes: { x: { facebook: {label: 'Advertisement in Facebook (in millions)', side: 'top'}, youtube: {label: 'Advertisement in Youtube (in millions)'} } } }; var materialChart = new google.charts.Bar(document.getElementById('point')); materialChart.draw(data, options); } </script> </body> </html>
OUTPUT
×

Save as Private