我正在尝试为不同日期的学生成绩创建比较折线图。 我想在一行中显示日期和标记,例如 2021 年,以及 2022 年不同日期的日期和标记。 我尝试了以下方法,但结果一直在创建彼此相邻的线条,而不是彼此重叠。附上结果,然后是第二张图片,我用油漆创建了一张图片,我想完成的是什么
<script type="text/javascript">
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(drawChart);
function drawChart() {
var data = new google.visualization.DataTable();
data.addColumn('date', 'Date');
data.addColumn('number', '2021 Marks');
data.addColumn('number', '2022 Marks');
data.addRows([
[new Date('2021-01-01'), 100, null],
[new Date('2021-02-15'), 150, null],
[new Date('2021-03-11'), 200, null],
[new Date('2021-04-20'), 175, null],
[new Date('2021-05-01'), 250, null],
[new Date('2022-01-26'), null, 150],
[new Date('2022-02-02'), null, 175],
[new Date('2022-03-15'), null, 225],
[new Date('2022-04-21'), null, 200],
[new Date('2022-05-16'), null, 275]
]);
var options = {
title: 'Comparison Line Graph',
hAxis: {
title: 'Months',
format: 'MMM'
},
vAxis: {
title: 'Mark',
viewWindow: {
min: 0,
max: 300
}
},
series: {
0: {
pointSize: 10,
label: '2021 Mark',
lineDashStyle: [2, 2],
targetAxisIndex: 0
},
1: {
pointSize: 10,
label: '2022 Mark',
lineDashStyle: [5, 5],
targetAxisIndex: 0
}
},
legend: {
position: 'top'
}
};
var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
options.series[0].targetAxisIndex = 0;
options.series[1].targetAxisIndex = 0;
chart.draw(data, options);
}
</script>