gpt4 book ai didi

charts - 使用带有部分数据的 google chart api 创建图表

转载 作者:行者123 更新时间:2023-12-01 23:34:57 27 4
gpt4 key购买 nike

我想创建折线图。目前我的图表看起来像这样

enter image description here

数据是实时的,因此图表应该从上午 9 点开始,并向 x 轴增加直到下午 4 点

当用户在中午 12 点生成图表时。我的预期结果是(注意:数据仅在中午 12 点之前可用。)

enter image description here

我找不到生成上述部分图表的方法。有什么想法吗?

最佳答案

希望我理解正确。注释中的代码是数据的剩余部分(从中午12点到下午4点)。如果没有这些数据,图表将根据您的需要显示部分图表。

<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');
data.addColumn('number');
data.addRows(8);
data.setValue(0, 0, '9AM');
data.setValue(2, 0, '11AM');
data.setValue(4, 0, '1PM');
data.setValue(6, 0, '3PM');
data.setValue(7, 0, '4PM');

data.setValue(0, 1, 5480); // 9AM
data.setValue(1, 1, 5475); // 10AM
data.setValue(2, 1, 5490); // 11AM
data.setValue(3, 1, 5490); // 12PM
/*
data.setValue(4, 1, 5500); // 1PM
data.setValue(5, 1, 5490); // 2PM
data.setValue(6, 1, 5530); // 3PM
data.setValue(7, 1, 5560); // 4PM
*/

var chart =
new google.visualization.AreaChart(document.getElementById('chart_div'));
chart.draw(data, {width: 500, height: 240,
vAxis: {minValue: 5460, maxValue: 5560},
colors: ['#76A4FB'],
legend: 'none'
});
}
</script>
</head>
<body>
<div id="chart_div"></div>
</body>
</html>

希望对您有所帮助。

关于charts - 使用带有部分数据的 google chart api 创建图表,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6190171/

27 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com