CODEWITHSUNDEEP
javascriptgoogle-visualizationdom-eventsgoogle-fusion-tables
andrew
andrew

Reputation: 2077

vAxis Values not visible in bar chart : Google Charts

My values in the vertical axis are not visible as shown in the image:

enter image description here.

What could be the problem with my code?

      function drawVisualization() {
    google.visualization.drawChart({
      containerId: 'visualization',
      dataSourceUrl: 'http://www.google.com/fusiontables/gvizdata?tq=',
      query: 'SELECT Environment, GirlPupils, BoyPupils, FemaleTeachers, MaleTeachers FROM 1eC4sIAgVXfFj01mOM2cDiyW2nly7TcFeIXj1G3s',
      chartType: 'BarChart',
      options: {
        title: 'Number of Students and Teachers',
        vAxis: {
          title: 'Environment'
        },
        hAxis: {
          title: 'Number'
        }
      }
    });
  }

Upvotes: 1

Views: 1918

Answers (1)

davidkonrad
davidkonrad

Reputation: 85578

As I can tell from the image the vertical values is actually shown! The issues is

  1. You have a very little height set for the chart-container, trying to show a lot of bars

  2. The fontSize for vAxis is to the opposit relatively large

  3. There can often be problems with lack of space to the left

Change the height of the <div>-container to something that actually can hold the many bars :

<div id="visualization" style="height:1000px;"></div>

Change fontSize for the vAxis and add some space to the left by chartArea

options: {
   title: 'Number of Students and Teachers',
   vAxis: {
      title: 'Environment',
      textStyle : { fontSize : 7 }
   },
      hAxis: {
      title: 'Number'
   },
   chartArea: {left: "150",top: 0 }
}

enter image description here

Edit :

In order to only select columns where Environment is Rural, Urban or Peri Urban, change your query to 

SELECT Environment, GirlPupils, BoyPupils, FemaleTeachers, MaleTeachers 
FROM 1eC4sIAgVXfFj01mOM2cDiyW2nly7TcFeIXj1G3s 
WHERE Environment IN ('Rural', 'Urban','Peri Urban')

note that normal SQL syntax OR is not supported by FusionTables, you must use IN. Also strings must be in single quotes ''.

Upvotes: 6

Related Questions