Google Chart hide grid zero -
set show 100 , -100 grids ticks: [-100, 100], horizontal 0 (zero) grid appears. how hide?
<table class="columns"> <tr> <th>linear scale</th> </tr> <tr> <td><div id="linear_div"></div></td> </tr> </table> <script> google.charts.load('current', {'packages':['corechart', 'line']}); google.charts.setonloadcallback(drawchart); function drawchart() { var data = new google.visualization.datatable(); data.addcolumn('date', 'date'); data.addcolumn('number', 'population'); data.addrows([ [new date(1400, 1, 1), -44], [new date(1500, 1, 1), 33], [new date(1600, 1, 1), 88], [new date(1700, 1, 1), 100], [new date(1750, 1, 1), 200], ]); var linearoptions = { title: 'world population since 1400 a.d. in linear scale', legend: 'none', width: 450, height: 500, haxis: { title: 'date' }, vaxis: { title: 'population (millions)', ticks: [-100, 100] } }; var linearchart = new google.visualization.linechart(document.getelementbyid('linear_div')); linearchart.draw(data, linearoptions); } </script>
use following option hide 0 (baseline)
baselinecolor: 'transparent' see following working snippet...
google.charts.load('current', {'packages':['corechart', 'line']}); google.charts.setonloadcallback(drawchart); function drawchart() { var data = new google.visualization.datatable(); data.addcolumn('date', 'date'); data.addcolumn('number', 'population'); data.addrows([ [new date(1400, 1, 1), -44], [new date(1500, 1, 1), 33], [new date(1600, 1, 1), 88], [new date(1700, 1, 1), 100], [new date(1750, 1, 1), 200] ]); var linearoptions = { baselinecolor: 'transparent', title: 'world population since 1400 a.d. in linear scale', legend: 'none', width: 450, height: 500, haxis: { title: 'date' }, vaxis: { title: 'population (millions)', ticks: [-100, 100] } }; var linearchart = new google.visualization.linechart(document.getelementbyid('linear_div')); linearchart.draw(data, linearoptions); } <script src="https://www.gstatic.com/charts/loader.js"></script> <div id="linear_div"></div>
Comments
Post a Comment