用高图表弄乱了折线图

Question

我正在使用HighCharts在我的网站上显示图表 我想要实现的只是带有（可缩放的）日期时间X轴和Y轴数字的折线图。
但结果搞砸了：

我通过ajax调用加载数据，创建一个数组并使用chart.series[0].setData(chartData);来设置图表的数据。以下是chartData的示例：

[[1343071800000, 17], [1343158200000, 171], [1343244600000, 291], [1343075400000, 18],
 [1343161800000, 74], [1343248200000, 293], [1343165400000, 183], [1343251800000, 296]]

另外，我使用DotNetHighCharts，因为我使用的是ASP.NET MVC 3，但生成的javascript用于创建图表如下：

chart = new Highcharts.Chart({
chart: { renderTo:'chart_container' },
legend: { align: 'left', borderWidth: 0, floating: true, layout: 'horizontal', verticalAlign: 'top', y: 20 },
plotOptions: { series: { cursor: 'pointer', marker: { lineWidth: 1 }, point: { events: { click: function() { alert(Highcharts.dateFormat('%A, %b %e, %Y', this.x) +': '+ this.y +' visits'); } } } } },
subtitle: { text: 'Source: Google Analytics' },
title: { text: 'Daily visits at www.highcharts.com' },
tooltip: { crosshairs: true, shared: true },
xAxis: { gridLineWidth: 1, labels: { align: 'left', x: 3, y: -3 }, tickInterval: 604800000, tickWidth: 0, type: 'datetime' },
yAxis: [{ labels: { align: 'left', x: 3, y: 16, formatter: function() { return Highcharts.numberFormat(this.value, 0); } }, showFirstLabel: false, title: { text: '' } }, { gridLineWidth: 0, labels: { align: 'right', x: -3, y: 16, formatter: function() { return Highcharts.numberFormat(this.value, 0); } }, linkedTo: 0, opposite: true, showFirstLabel: false, title: { text: '' } }],
series: [{ name: 'All visits' }]  

Answer 1

您的数据集不按时间顺序排列。因此，图表系统尽可能地加入所有点。 对于基于时间的系列，最好从最早到最晚对时间进行排序。