谷歌图表：显示错误的酒吧

Question

我目前正致力于Google Bar Chart-Dual-X，而且效果很好。

问题：

栏显示错误。例如：假设我想显示获得的标记和总标记。但是问题是谷歌图表显示获得的标记栏大于总标记（根本不是真的）。你可以在下面看到图片：

正如你在图片中看到的那样第6,7,8 条获得的标记栏比总标记栏大。

代码

<script type="text/javascript">
  google.load("visualization", "1.1", {packages:["bar"]});
  google.setOnLoadCallback(drawStuff);

  function drawStuff() {
    var data = new google.visualization.arrayToDataTable([
      ['Subject', 'Obtained Marks', 'Total Marks'],
    <?php 
        $i=1;
        foreach($sql_get_marks_results as $sql_get_marks_result){
            echo "['".$sql_get_marks_result->meta_subject."', ".$sql_get_marks_result->obtained_marks.", ".$sql_get_marks_result->total_marks."]";
            if($i != count($sql_get_marks_results)){echo ",";}
            $i++;
        }
    ?>
    ]);

    var options = {
      width: 900,
      chart: {
        title: 'Markesheet',
        subtitle: 'distance on the left, brightness on the right'
      },
      bars: 'horizontal', // Required for Material Bar Charts.
      series: {
        0: { axis: 'obtained' }, // Bind series 0 to an axis named 'distance'.
        1: { axis: 'total' } // Bind series 1 to an axis named 'brightness'.
      },
      axes: {
        x: {
          obtained: {label: 'Obtained'}, // Bottom x-axis.
          total: {side: 'top', label: 'Total'} // Top x-axis.
        }
      }
    };

  var chart = new google.charts.Bar(document.getElementById('dual_x_div'));
  chart.draw(data, options);
};
</script>

在这里遇到类似问题的人或任何人都可以帮助我吗？

告诉我你是否想了解更多细节。

Answer 1

屏幕截图中显示的显示是正确的。

＆＃34;总分＆＃34; （红色）数据集遵循底部x轴 ＆＃34;获得＆＃34;获得＆＃34; （蓝色）数据集遵循顶部x轴。

我认为你的两个X轴的比例（由数据范围推断）非常接近。因此，很容易混淆他们。

双x轴图表适用于补色数据集，其值与in the example given in the documentation的范围差别很大。

在您的情况下，您最好使用简单（单轴）条形图来避免这种混淆。