谷歌条形图中的注释

时间:2015-03-05 19:07:05

标签: javascript google-visualization bar-chart

我在谷歌排行榜中没有看到注释。 这是代码。

http://jsfiddle.net/sn37vp58/1/

   google.load('visualization', '1', {packages: ['corechart']});
    google.setOnLoadCallback(drawChart);

    function drawChart() {
var data = new google.visualization.arrayToDataTable([

                        ['Status', 'Completed', 'In Progress', 'Registered / Not Started','Past Due',{role: 'annotation'}],     

                        ['Safety',100.0,0.0,0.0,0.0,'Hello'],['Conduct ',100.0,0.0,0.0,0.0,'Hello'],['Policy',100.0,0.0,0.0,0.0,'Hello'],['Privacy',100.0,0.0,0.0,0.0,'Hello'],['Violence',100.0,0.0,0.0,0.0,'Hello'],['Integrity',0.0,0.0,100.0,0.0,'Hello']

                         ]);    

                        var options = {

                height: 500,
                            width:  500,
                            chartArea:{left:100,top:100,right:0,bottom:0},
                            hAxis: { ticks: [25,50,75,100] },
                            isStacked: true,
                            bar: {groupWidth: '20'},
                            vAxis:{textStyle:{color: '#000000',fontSize: '12', paddingRight: '0',marginRight: '0'}},
                            colors: ['green','#ffff99','#ffbf0c','red'],
                            legend: { position: 'top'   },
annotations: {
          alwaysOutside: false,
          textStyle: {
            fontSize: 17,
            auraColor: '#eee',
            color: '#eee'
          }}, 
                         };


      var chart = new google.visualization.BarChart(
        document.getElementById('ex5'));

      chart.draw(data, options);
    }

我使用谷歌可视化条形图来显示条形图但缺少注释....

1 个答案:

答案 0 :(得分:2)

将annotations.alwaysOutside设置为true将使它们显示出来。 See jsfiddle

      alwaysOutside: true,
      textStyle: {
        fontSize: 17,
        auraColor: 'none',
        color: '#555'
      }