我想根据用户在高图表中的输入动态设置结束行对象。 用户将从值 5、10、25 和 all 之间的列表控件中进行选择,我想将该值传递给 data.endrow 属性。 思潮?
data: {
csv: document.getElementById('csv').innerHTML,
startRow: 0,
endRow: <userinput>
endColumn: 1,
firstRowAsNames: false
},
您可以在
单击提交按钮后制作图表。您可以检查列表中的选定值并将其传递给图表选项:
$('.submit').click(function() {
var dropMenu = $('#drop'),
selectedIndex = dropMenu[0].options.selectedIndex,
stringVal = $(dropMenu)[0].options[selectedIndex].value,
value = parseInt(stringVal);
if (stringVal === 'All') {
var lines = document.getElementById('csv').innerHTML.split('n');
value = lines.length - 1;
}
});
然后,您可以使用新的endRow参数制作图表:
$('#container').highcharts({
title: {
text: 'Global temperature change'
},
subtitle: {
text: 'Data module: Show only last 20 years by limiting start row.'
},
data: {
csv: document.getElementById('csv').innerHTML,
startRow: 1,
endRow: value,
endColumn: 1,
firstRowAsNames: false
},
xAxis: {
allowDecimals: false
},
series: [{
name: 'Annual mean'
}]
});
示例:http://jsfiddle.net/jpko073c/3/