0

時間のさまざまな関数のグラフを表示するためにjqPlotwithを使用しています。DateAxisRendererグラフをアプリケーションの他のモジュールと通信させたいのですが、それらは時間データも処理します（グラフは処理しません）。これを実現するために、すべてのモジュールは同じ変数を読み書きしtimeます（したがって、常に同じ瞬間にデータを表示します）。いずれかのモジュールが変数を設定する場合、他のモジュールはそれに応じて反応する必要があります。

例x：ユーザーが読み取り可能な形式で時間を入力すると、グラフに適切な座標でカスタムティックが表示されます。

ただし、これを実装するには、3つの時間表現の間で変換する必要があります

  • 人間が読める形式（またはDateカプセル化としてのjavascriptオブジェクト）
  • jqPlot時間を表すために内部的に使用されるタイムスタンプ
  • xグラフの座標（ピクセル単位）

DateAxisRendererをレンダリングするときに表示されるように、カスタマイズ可能な人間が読める形式でタイムスタンプを表示できることを私は知っていx-axisます。xグラフをクリックすると、イベント情報のタイムスタンプが（座標とともに）取得されることがわかります。しかし、私の質問は、これらの変換を明示的に行う方法は？。

4

1 に答える 1

1

日付<->人間が読める形式

Datejsはこれに適しています。例えば：

var date = Date.parse('February 20th 1973');
var date = Date.parse('next thursday');

// Now let's convert a date into a human-readable string
var dateString = date.toString('dddd, MMMM d, yyyy');

日付<->jqPlotタイムスタンプ

jqPlotで内部的に使用されるタイムスタンプは、ミリ秒単位のUnix時間です。

var exampleTimestamp = 1345671839000;
var date = new Date(exampleTimestamp);

// Now let's convert a date into a timestamp
var jqPlotTimestamp = date.getTime();

日付<->x座標（ピクセル単位）

x軸が線形であると仮定すると、次のようにx軸上の点の値を決定できます（独自の値を入力します）。

var myPlot = jqplot(...);
var xAxis = myPlot.axes.xaxis;

var MARGIN_LEFT = 15; // Pixels from [left edge of chart --> minimum X value]

var pixelRange = 300; // Pixels from [min X value --> max X value]
var timeRange = xAxis.max - xAxis.min;

var time; // This will be our answer in the chart's units
time = xAxis.min + timeRange * (xCoordinate - MARGIN_LEFT) / pixelRange;

var timeInMillis = ... ; // Convert the X-Axis unit of time into millis
var date = new Date(timeInMillis);

// Now let's convert a date into an x coordinate
timeInMillis = date.getTime();
time = ...; // Convert millis into X-Axis unit of time
var x = MARGIN_LEFT + pixelRange * (time - xAxis.min) / timeRange;

この投稿を書いている時点で、軸名のリストは次のとおりです。

['yMidAxis', 'xaxis', 'yaxis', 'x2axis', 'y2axis', 'y3axis', 'y4axis', 'y5axis', 'y6axis', 'y7axis', 'y8axis', 'y9axis'];
于 2012-08-23T01:25:37.853 に答える