我正在尝试在我的折线图中添加条纹填充,似乎有一个正式的解决方案https://developers.google.com/chart/image/docs/gallery/line_charts,他们谈论chf。
但是,我不知道如何实现这一点,我已经用Google搜索了,现在搜索了stackoverflow几个小时,似乎无法找到解决方案。
我需要像偶数/奇数css函数一样的条纹填充。
google.charts.load('current', {'packages':['corechart']});
google.charts.setOnLoadCallback(Process1);
function Process1() {
var data = google.visualization.arrayToDataTable([
['value1', 'value2', 'value3', 'value4'],
['10', 400, 380, 48],
['20', 400, 340, 260],
['30', 400, 410, 310],
['40', 400, 390, 380],
['50', 400, 345, 345],
['60', 400, 385, 370],
['70', 400, 430, 410],
['80', 400, null, null],
['90', 400, null, null],
['100', 400, null, null],
['110', 400, null, null],
['120', 400, null, null]
]);
var options = {
theme: 'material',
lineWidth: 3,
colors: ['#3D3D3D', '#4CDD37', '#2076F2'],
title: 'Orderinformation plan 1',
titleTextStyle: {fontName:'Lato', fontSize:'20'},
legend: {
position: 'right',
textStyle: {
fontName:'Lato', fontSize:'12'
},
},
hAxis: {
title: 'Time in minutes',
titleTextStyle: {fontName:'Lato', fontSize:'16', italic:false},
textStyle: {
fontName:'Lato', fontSize:'16'
},
},
vAxis: {
title: 'Temperature in celsius',
titleTextStyle: {fontName:'Lato', fontSize:'16', italic:false},
textStyle: {
fontName:'Lato', fontSize:'16'
},
viewWindowMode: 'explicit',
ticks: [25,50,100,150,200,250,300,350,400,460],
viewWindow: {
max:460,
min:25
},
gridlines: {
count: 10
}
}
};
var chart = new google.visualization.LineChart(document.getElementById('curve_chart_1'));
chart.draw(data, options);
}