2

highcharts-ng を使用して折れ線グラフを作成する角度のあるアプリケーションがあります。Y 軸は数値、X 軸は日時です。

moment.js を使用して「America/New_York」と「Europe/London」の 2 つのタイムゾーンを変換するときに、夏時間の変更を適切に考慮しようとしています。

ロンドンは現在 BST にあるため (これを投稿した時点で)、+1:00 です。

tick.TimeStamp
> "2015-04-21T16:06:06.0786392-04:00"

tick.TimeStampは、私の「America/New_York」時間です (現在は EDT です)。私はそれをロンドン時間に変換します...

moment(tick.TimeStamp).tz("Europe/London").format()
> "2015-04-21T21:06:06+01:00"

highcharts-ng の x 軸に結果をプロットするには、Unix エポック ティックで結果が必要なので、使用します...

var d = moment(tick.TimeStamp).tz("Europe/London").format()
moment(d).valueOf()

利回り

1429646766000

問題は、このティック値の結果が datetime であることです。

2015 年 4 月 21 日 (火) 20:06:06 GMT

どこにあるべきか

2015 年 4 月 21 日 (火) 21:06:06 GMT

ロンドンは現在 BST +1:00 にあるため

私は何か間違ったことをしていますか、それとも瞬間的にこれを間違って計算していますか?

どんな助けでも大歓迎です。ありがとうございました!

編集: 私の moment-timezones.js は、すべてのタイムゾーン情報を含むサイトの最新のものであることに言及する必要があります。

4

3 に答える 3

2

サンプルを提供するために JS フィドルを更新しました。http://jsfiddle.net/x0z90vqg/type ( HighStock を使用していない場合、xAxis のプロパティを示すフィドルを更新)

あなたの問題は、Highcharts グローバル オブジェクトのプロパティ useUTC および timezoneOffset プロパティを適切に使用していないことだと思います。コントロールを使用するhighcharts-ngと、Highcharts ライブラリの機能の一部がマスクされますが、必要な機能には非常に簡単にアクセスできます。

フィドルの関連部分は次のとおりです。

Highcharts.setOptions({
    global : {
        useUTC : false,
        timezoneOffset: -5
    }
});
$scope.chartConfig.getHighcharts().redraw();

上記の例では、日付/時系列に UTC を使用しないように Highcharts グローバル オブジェクトを設定し、オフセットを -5 時間に設定します (既に行っているように、moment.js を使用して必要なオフセットを取得できます)。highcharts-ngの公開されたgetHighcharts()メソッドを介して再描画します。そのメソッドは実際のチャート オブジェクトを返します。そこからは、中間コンポーネントを介さずにハイチャートを直接使用しているように見えます。

編集

@マットは非常に良い点を指摘しました。このように timezoneOffset を設定することは、実際のタイムゾーンを設定することとまったく同じではありません。真のタイムゾーンでは、DST の変更などが考慮されます。これは、UTC からの静的オフセットにすぎません。このように UTC オフセットを設定すると、1 つの系列だけでなく、グラフ全体にも影響します。異なるタイムゾーンで同じグラフに 2 つ以上のシリーズを表示 (および比較) し、そのデータをそれぞれのタイムゾーンとして表示する必要がある場合は、複数の X 軸を有効にし、各軸のフォーマット ラベル ロジックで X 値を取得します。目盛りの場合、javascript関数を介して、表示するタイムゾーンの値とラベルに変換します。これにより、2 つの異なるタイムゾーンのラベルを持つ 2 つの X 軸が作成されますが、グラフの中央部分のデータは同じ UTC スケールで実行されます。これを行う場合、

これらすべてを行っても、DST が切り替わるポイントをまたぐ時系列データを表示するという問題はまだ解決されていません。私は、Highcharts がそれを表現する方法を持っているとは思いませんし、どちらかを表現する別のチャート ライブラリも知りません。かなり一般的な問題のようですが、どこかで解決されていると思います...

于 2015-04-21T22:15:48.063 に答える
0

私が理解したことの簡単な更新を投稿したかっただけです。クライアント側でこれを実行しようとして多くの癖に遭遇したため、コントローラー コード (.NET) でサーバー側でこれを処理する良い方法を見つけました。タイムスタンプ (tick.TimeStamp) を返すだけでなく、EasternTimeStampLondonTimeStampを返すようになりました。TimeZoneInfo クラスの優れたメソッドを使用して、これを実現できました。

    /// <summary>
    /// Converts the time to eastern standard time.
    /// This should properly account for DST, putting the time in EST (-5:00) or EDT (-4:00)
    /// </summary>
    public static DateTime ConvertTimeToEasternStandardTime(DateTime inputDateTime)
    {
        // US eastern timezone=Eastern Standard Time
        string targetTimeZoneId = "Eastern Standard Time";
        DateTime outputDateTime = TimeZoneInfo.ConvertTimeBySystemTimeZoneId(inputDateTime, targetTimeZoneId);
        return outputDateTime;
    }

    /// <summary>
    /// Converts the time to GMT standard time.
    /// This should properly account for DST, putting the time in BST (+1:00) or GMT (+0:00)
    /// </summary>
    public static DateTime ConvertTimeToGMTStandardTime(DateTime inputDateTime)
    {
        // London timezone=GMT Standard Time
        string targetTimeZoneId = "GMT Standard Time";
        DateTime outputDateTime = TimeZoneInfo.ConvertTimeBySystemTimeZoneId(inputDateTime, targetTimeZoneId);
        return outputDateTime;
    }

願わくば、この問題に遭遇した人なら誰でもこれが役に立つと思うでしょう。この 1 週間、このような DST とタイムゾーンに対処するための適切な方法を見つけようとするのは、かなりのストレスであることがわかりました。

于 2015-04-23T11:37:36.613 に答える