如何在Google Chart API的列顶部显示值 [英] How to show values on the top of columns Google Chart API

查看:67
本文介绍了如何在Google Chart API的列顶部显示值的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我想在此图表
的顶部显示值,就像这张图片一样:

I would like to show values on the top of my columns chart just like in this image:

但是我想使用新的Google Chart API来显示它们。
这是网站及其源代码

But I want to show them using the new Google Chart API. Here is the site and its source code.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load("visualization", "1", {packages:["corechart"]});
google.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('string', 'Month');
data.addColumn('number','a');
data.addColumn('number','v');
data.addColumn('number','c');
data.addColumn('number','e');
data.addRows(5);
data.setCell(0, 0, 'dfa');
data.setCell(1, 0, 'Sdfa');
data.setCell(2, 0, 'Mdz');
data.setCell(3, 0, 'sd');
data.setCell(4, 0, 'Rsdr');
data.setCell(0, 1,  114);
data.setCell(1, 1,  723);
data.setCell(2, 1, 238);
data.setCell(3, 1,  509);
data.setCell(0, 2,  636);
data.setCell(1, 2,  410);
data.setCell(2, 2,  395);
data.setCell(3, 2,  668);
data.setCell(0, 3,  508);
data.setCell(1, 3, 709);
data.setCell(2, 3,  686);
data.setCell(3, 3, 533);
data.setCell(0, 4, 643);
data.setCell(1, 4, 737);
data.setCell(2, 4,  964);
data.setCell(3, 4,  945);
var chart =   new google.visualization.ColumnChart(document.getElementById('chart_div')).
draw(data,
{title:"Parc localisé par région et par offre", 
width:500, height:300,
series: {0:{color: '#CF0980', visibleInLegend: true}, 1:{color: '#999999', visibleInLegend: true}, 2:{color: '#990099', visibleInLegend: true}, 3:{color: '#FF99CC', visibleInLegend: true}},isStacked:"true"});}
</script>  
</head>
<body><div id="chart_div"></div>
</body>
</html>


推荐答案

只需添加

annotations: {
    alwaysOutside: true
}

到配置对象

这篇关于如何在Google Chart API的列顶部显示值的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆