0

期間を表すために Google Charts チャートで使用したいミリ秒数の列があります。その数をタイムスパンに変換するにはどうすればよいですか?

4

3 に答える 3

2

ケニーの答えを拡張するには、データをミリ秒単位で入力すると、DataView を使用してそれをtimeofdayデータ型に変換できます。

var timeFormatter = new google.visualization.DateFormat('HH:mm:ss.SSS'); // set this pattern however you need to format your time display
var view = new google.visualization.DataView(data);
view.setColumns([/* columns before timeofday */, {
    type: 'timeofday',
    label: 'Time of Day',
    calc: function (dt, row) {
        var timeOfDay = toTimeSpan(data.getValue(row, /* time column index */);
        var formattedTime = timeFormatter.formatValue(timeOfDay);
        return {v: timeOfDay, f: formattedTime};
    }
}, /* columns after timeofday */]);
于 2014-05-27T20:28:59.703 に答える
1

Google Charts では、タイプを使用して時間範囲を表すことtimeofdayができます。これにより、2 回追加して 3 回目を取得し、チャートを自動的に適切にフォーマットすることができます。Atimeofdayは実際には、時間、分、秒、および (オプションで) ミリ秒の 4 つの要素を持つ配列です。DataTable の のプロパティの下にあるこのページの の説明を参照してください。timeofdaytypecols

の各フィールドは、timeofdayそのタイプのインクリメントの境界内にある必要があります。999 を超えるものは範囲外であるため、タイムスパン全体をミリ秒フィールドにダンプして 1 日と呼ぶことはできません。

この関数を使用して、ミリ秒のタイム スパンを次のように変換できますtimeofday。

function toTimeSpan(milliseconds)
{
    var timespan = [0, 0, Math.floor(milliseconds / 1000), milliseconds % 1000];

    // Minutes
    if (timespan[2] >= 60)
    {
        timespan[1] = Math.floor(timespan[2] / 60);
        timespan[2] %= 60;

        // Hours
        if (timespan[1] >= 60)
        {
           timespan[0] = Math.floor(timespan[1] / 60);
           timespan[1] %= 60;
        }
    }

    return timespan;
}

timeofday警告: 24 時間を超えるスパンを保持することはできないと思います。その機能が必要な場合は、number列を使用して独自の書式を作成する必要がある場合があります。

于 2014-05-27T12:54:25.577 に答える
1

asgallant答えとして使用すると、Kenny Dewhirst私は非常に似たようなことをすることになりましたが、関数を使用する代わりにtoTimeStamp、new Date(milliseconds). livescript を使用した以下のコード。

   function millisToDate dt, row
      date = new Date(dt.getValue(row, 0))
      dateFormatter = new google.visualization.DateFormat({pattern: "EEEE d 'de' MMMM 'de' yyyy, H:mm"});
      {v: date, f: dateFormatter.formatValue date}

   view = new google.visualization.DataView data
     view.setColumns([/* columns before timeofday */, {
     type: 'datetime',
     calc: millisToDate
    },  /* columns after timeofday */])

注:type: 'date'グラフが 1 日分のデータを表示する場合、横軸が時間を表示しないようにしました。datetimeこれを固定に変更。

于 2016-05-16T14:52:49.247 に答える