0

サイトにグラフを表示するために HighCharts を使用しています。
私が達成したいのは、(ズーム可能な) Date-Time 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]]

また、ASP.NET MVC 3 を使用しているので DotNetHighCharts を使用していますが、グラフを作成するために生成された 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' }]
4

1 に答える 1

3

データセットは時系列ではありません。したがって、チャートシステムは可能な限りすべてのポイントを結合しています。時間ベースのシリーズの場合、時間を早いものから遅いものへと並べ替えることが常に最善です。

于 2012-07-26T17:08:40.493 に答える