2015-10-05 44 views
1

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

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

我设置了一个'西红柿'背景颜色,使空间更加明显。

谢谢大家。

+0

请添加一些说明。没有得到你想问的问题。 –

回答

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>

+0

嗨@WhiteHat,感谢您的帮助。 – d2dbr

+1

欢呼!乐意效劳。你会接受答案吗? – WhiteHat