如何使用组合图在条形图中创建连续线



这是我的代码,我想在我的图表中创建一条像目标一样的连续线,我遵循了谷歌图表中发布的示例。我需要创建一个函数吗?

function drawChart() {
var data = google.visualization.arrayToDataTable([
['Task', 'Hours per Day'],
['Work', 8],
['Eat', 2],
['TV', 4],
['Gym', 2],
['Sleep', 8]
]);
var options = {
title:'My Average Day',
vAxis: {title: 'Tasks'},
hAxis: {title: 'Hours per Day'},
seriesType:'bar',
series:{4:{type:'line'}}
};
var chart = new google.visualization.ComboChart(document.getElementById('chart1'));
chart.draw(data, options);
}

seriesType应该是"bar"而不是"bar",并且您的数据应该是这样的,以便为"睡眠"划线,例如:

google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = google.visualization.arrayToDataTable([
['Task', 'Hours per Day', 'Sleep'],
['Work', 8, 8],
['Eat', 2, 8],
['TV', 4, 8],
['Gym', 2, 8],
]);
var options = {
title:'My Average Day',
vAxis: {title: 'Tasks'},
hAxis: {title: 'Hours per Day'},
seriesType:'bars',
series:{1:{type:'line'}}
};
var chart = new google.visualization.ComboChart(document.getElementById('chart1'));
chart.draw(data, options);
}
<script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
<div id="chart1" style="width: 900px; height: 500px;"></div>

最新更新