vAxis值在条形图中不可见：Google Charts

Question

我在垂直轴上的值不可见，如图像中所示。我的代码可能有什么问题？

      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'
        }
      }
    });
  }

Answer 1

正如我从图像中可以看出的那样，垂直值实际显示了！问题是

1. 您为图表容器设置的高度非常小，试图显示批次的条形

2. vAxis的fontSize是相对较大的对立

3. 左侧空间不足可能会出现问题

将<div> - 容器的高度更改为实际可容纳多个条形的内容：

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

更改vAxis的fontSize并通过chartArea

向左侧添加一些空格

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



---

编辑：

要仅选择Environment为Rural，Urban或Peri Urban的列，请将查询更改为

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

请注意，FusionTables不支持普通的SQL语法OR，您必须使用IN。字符串也必须用单引号''。