堆积柱形图在每列顶部显示一个小的零值条子

问题描述 投票:0回答:1

我有一个堆积柱形图。每列有三个块,但其中一些块的值为零。 列将最后一个元素显示为一个可悬停的小切片。 我希望它不显示或悬停。 我怎样才能禁止这些显示?

<script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script>
<script type="text/javascript">
     function drawStackedChart() {
          var data = google.visualization.arrayToDataTable([
               ['Columns', 'A', 'B', 'C'],
               ['Column1',  1 ,  0 ,  0],
               ['Column2',  0 ,  1 ,  0]]
          );
          var options = {
               isStacked: true
          };
          new google.visualization.ColumnChart(document.getElementById('stackedChart')).draw(data, options);
     }
     google.load("visualization", "1", {packages:["corechart"]});
     google.charts.setOnLoadCallback(drawStackedChart);
</script>
<div id="stackedChart"></div>

Column 1 showing small slice

Column 2 showing small slice

我尝试在末尾添加空白注释,但这没有帮助。我希望有人能给我指出让这些小切片消失的正确方法。

charts google-visualization stacked-chart google-loader
1个回答
0
投票

我解决了自己的问题并为其他人发帖。 我的 JS 格式不正确。 这是工作版本:

<script type='text/javascript' src='https://www.gstatic.com/charts/loader.js'></script>
<script type="text/javascript">
    function drawStackedChart() {
      var data = google.visualization.arrayToDataTable([
           ['Columns', 'A', 'B', 'C'],
           ['Column1',  1 ,  0 ,  0],
           ['Column2',  0 ,  1 ,  0]]
      );
      var options = {
           isStacked: true
      };
      var chart_div = document.getElementById('stackedChart');
      var chart = new google.charts.Bar(chart_div);
      chart.draw(data, google.charts.Bar.convertOptions(options));
    }
    google.charts.load('current', {'packages':['bar']});
    google.charts.setOnLoadCallback(drawStackedChart);
</script>
<div id="stackedChart"></div>
© www.soinside.com 2019 - 2024. All rights reserved.