如何动态添加新的图表类型到谷歌烛台图表
Posted
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何动态添加新的图表类型到谷歌烛台图表相关的知识，希望对你有一定的参考价值。
这篇文章展示了如何添加相同的图表类型（线）How to add another data series to a Google chart
这一个不是真正的烛台图表Candlesticks is always on top of lines in combo chart google chart
真正的烛台不是combochart https://developers.google.com/chart/interactive/docs/gallery/candlestickchart
那么可以在真正的烛台谷歌图表中添加一条线和/或条形图吗？
答案
使用series选项更改类型...
四个烛台列将被视为系列＃：0
请参阅以下工作代码段...
google.charts.load('current', {
packages: ['corechart']
}).then(function () {
var data = google.visualization.arrayToDataTable([
['Day', 'Candlestick', 'Begin', 'End', 'High'],
['Mon', 20, 28, 38, 45],
['Tue', 31, 38, 55, 66],
['Wed', 50, 55, 77, 80],
['Thu', 77, 77, 66, 50],
['Fri', 68, 66, 22, 15]
]);
// add column for line, add data to rows...
var colIndex = data.addColumn('number', 'Line');
for (var i = 0; i < data.getNumberOfRows(); i++) {
data.setValue(i, colIndex, data.getValue(i, 1));
}
var options = {
height: 400,
series: {
1: {
type: 'line'
}
}
};
var chart = new google.visualization.CandlestickChart(document.getElementById('chart_div'));
chart.draw(data, options);
});<script src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart_div"></div>以上是关于如何动态添加新的图表类型到谷歌烛台图表的主要内容，如果未能解决你的问题，请参考以下文章