ठीक है, ये रहा पूरा समाधान:
<!DOCTYPE html><html><head>
</head><body>
<div id="container" style="height: 400px; width: 900px"></div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://www.highcharts.com/js/highcharts.src.js"></script>
<script>
jQuery(function($) {
var options = {
chart: {renderTo: 'container', defaultSeriesType:'spline', height: 400},
title: {text: 'SEN-2 Bulkhead Isolation'},
xAxis: {title: {text: 'Frequency Hz'}, type: 'logarithmic'},
yAxis: {title: {text: 'Isolation dB'}, plotLines: [{ value: 0, width: 1, color: '#808080'}]},
tooltip: {
formatter: function() {
return '<b>'+ this.series.name +'</b><br/>'+'('+this.x +' : '+ this.y +')';
}
},
legend: {layout: 'vertical', align: 'right', verticalAlign: 'top', x: 40, y: 100, borderWidth: 0, width: 300 },
series: []
};
jQuery.get('data2.php', null, function(tsv) {
var data = {};
tsv = tsv.split(/\n/g); // split into rows
for (var row=0, rows=tsv.length; row<rows; row++) {
var line = tsv[row].split(/\t/g), // split into columns
series_name = line[0],
x = Number(line[1]),
y = Number(line[2]);
if (!data[series_name]) data[series_name] = [];
data[series_name].push([x,y]);
}
for (var series_name in data) {
options.series.push({
name: series_name,
data: data[series_name]
});
}
new Highcharts.Chart(options);
});
});
</script>
</body></html>
मैंने इस TSV डेटा के साथ इसका परीक्षण किया:
SSTP Keystone STEEL 0.6 74.9
SSTP Keystone STEEL 0.895 81.74
SSTP Keystone STEEL 1.336 77.26
SSTP Keystone STEEL 1.993 76.81
SSTP Keystone STEEL 2.974 80.45
SSTP Keystone STEEL 4.438 69.41
SSTP Keystone STEEL 6.622 61.37
SSTP Keystone STEEL 9.881 79.07
SSTP Keystone STEEL 14.744 79.75
SSTP Keystone STEEL 20.000 72.33
मैं जो कर रहा हूं वह TSV के माध्यम से लूपिंग कर रहा है और data
का निर्माण कर रहा है श्रृंखला के नाम पर कुंजीबद्ध एक साहचर्य सरणी की तरह चर, इस तरह:
{
'SSTP Keystone STEEL': [[0.6,74.9],[0.895,81.74],...],
...
}
तब मैं data
. के माध्यम से लूप कर रहा हूँ परिवर्तनीय और निर्माण options.series
उस प्रारूप में जिसकी HighCharts अपेक्षा करता है - एक name
. के साथ वस्तुओं की एक सरणी संपत्ति और एक data
संपत्ति।