Question

我需要一个简单的条形图，只有一个百分比条和标签。我试图用'chartArea'删除条形图和总画布之间的填充，但结果不是预期的，任何人都知道我该怎么做？

<https://jsfiddle.net/rro74054/1/>

我设置了'番茄'背景颜色，使空间更加明显。

谢谢大家。

Answer 1

将此添加到您的选项...

    bar: {
      groupWidth: '100%'
    },

示例...

google.load('visualization', '1', {packages: ['corechart']});
google.setOnLoadCallback(drawRightY);

function drawRightY() {
  var data = google.visualization.arrayToDataTable([
    ['', 'name1', {type: 'string', role: 'annotation'}, 'name2', {type: 'string', role: 'annotation'}, 'name3', {type: 'string', role: 'annotation'}],
    ['', 50, '50', 100, '100', 150, '150']
  ]);

  var options = {
    width: 400,
    height: 400,
    bar: {
      groupWidth: '100%'
    },
    chartArea: { width: '100%', height: '100%', backgroundColor: 'tomato'},
    isStacked: 'percent',
    annotations: {
      alwaysOutside: false,
      textStyle: {
        fontSize: 10,
        auraColor: 'none',
        color: '#fff'
      }
    },
    legend: 'none',
    enableInteractivity: false,
    hAxis: {
        baseline: 0,
        gridlines: { count: 0 }
    }
  };

  var chart = new google.visualization.BarChart(document.getElementById('chart_div'));
  chart.draw(data, options);
}

<script src="https://www.google.com/jsapi"></script>
<div id="chart_div"></div>

在Google条形图中删除填充

1 个答案: