向气泡图颜色轴添加标题
在一个项目中,我将使用 Google Chart API 来显示包含三个变量的气泡图。我知道如何更改轴的标题,但如何向图表顶部的颜色栏添加标题?
示例
我修改了文档中的示例以包含轴标签。请注意,原件没有绿色标题“如何向此栏添加标题”。
这是来自 Google documentation 的原始源代码我在其中添加了轴的标题属性。我尝试向 colorAxis 添加 title 属性,但没有任何效果。
<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 = google.visualization.arrayToDataTable([
['ID', 'X', 'Y', 'Temperature'],
['', 80, 167, 120],
['', 79, 136, 130],
['', 78, 184, 50],
['', 72, 278, 230],
['', 81, 200, 210],
['', 72, 170, 100],
['', 68, 477, 80]
]);
var options = {
colorAxis: {colors: ['yellow', 'red']},
hAxis: { title: "X AXIS" },
vAxis: { title: "Y AXIS" }
};
var chart = new google.visualization.BubbleChart(document.getElementById('chart_div'));
chart.draw(data, options);
}
</script>
</head>
<body>
<div id="chart_div" style="width: 900px; height: 500px;"></div>
</body>
</html>
我的问题
如何添加与上图类似的标题?
最佳答案
您可以为图表添加一个标题,该标题将放置在 colorAxis
的正上方:
var options = {
title: 'How can I add a caption to this bar?',
colorAxis: {colors: ['yellow', 'red']},
hAxis: { title: "X AXIS" },
vAxis: { title: "Y AXIS" }
};
它并不完全是colorAxis
的标题,但它可以具有相同的效果。
关于javascript - 谷歌图表 : How to add a caption to the color axis,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26735136/