how to disable the x axis and y axis line in google api line chart

22,525

Solution 1

you cant remove or disable your x and y axis in google api the alter way is to set the baselineColor and gridlineColor same as the background color and set the textPosition to none.

vAxis:{
         baselineColor: '#fff',
         gridlineColor: '#fff',
         textPosition: 'none'
       }

Solution 2

With the current version of Google Charts, the following removes axis lines:

hAxis: {
  baselineColor: 'none',
  ticks: []
},
vAxis: {
  baselineColor: 'none',
  ticks: []
}
Share:
22,525
Hariprasath
Author by

Hariprasath

Im self motivated smart worker

Updated on July 10, 2022

Comments

  • Hariprasath
    Hariprasath almost 2 years

    im using google api for line graph in my web application. in that line chart i dont want x axis line and y axis line, but i cant to fine how to remove the lines except the graph. could you please help me. i used this example for my practice

    <script type="text/javascript">
          google.load("visualization", "1", {packages:["corechart"]});
          google.setOnLoadCallback(drawChart);
          function drawChart() {
            var data = google.visualization.arrayToDataTable([
              ['Year', 'Sales', 'Expenses'],
              ['2004',  1000,      400],
              ['2005',  1170,      460],
              ['2006',  660,       1120],
              ['2007',  1030,      540]
            ]);
    
            var options = {
              title: 'Company Performance'
            };
    
            var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
            chart.draw(data, options);
          }
        </script>
    
  • Todd Smith
    Todd Smith over 9 years
    You can also set the color to 'transparent'
  • strange_098
    strange_098 almost 9 years
    @PatrikBeck try hAxis:{ textPosition: 'none' } for x axis
  • Chris Wheeler
    Chris Wheeler almost 7 years
    I spent a while trying to figure out why this wasn't working, only to realise that the baseline for the hAxis is a vertical line and the baseline for the vAxis is a horizontal line. So if you want to remove the horizontal black line you need to set the vAxis baselineColor and vice-versa.
  • Wraith
    Wraith about 5 years
    This is perfect answer. Thanx a lot for help
  • BodgeIT
    BodgeIT almost 5 years
    @ChrisWheeler 's comment provided the missing link for me. Thank you.