0

jqPlot を使用して、誰かが何かを完了するのにかかる時間をプロットしようとしています。xaxis では、日付が正しく表示されています。ただし、yaxis では、時間、分、秒を表示したいと考えています。何度やっても正しく表示されません。

以下のスクリーン キャプチャは、y 軸上のティック マッピングを示しています。

これがCoffeeScriptです...

    $.jqplot(
        "elemid"
        [["2013-02-01 01:30:28 AM", 97640000],["2013-02-01 01:31:38 AM", 166270000]]
        axes:
            xaxis:
                min: data.XAxisMin
                max: data.XAxisMax
                tickInterval: "1 month"
                tickOptions:
                    formatString: "%b %#d"
                renderer: $.jqplot.DateAxisRenderer
            yaxis:
                min: 0
                #tickOptions:
                     #formatString: "%#Mm"
                tickRenderer: $.jqplot.canvasAxisTickRenderer
                #renderer: $.jqplot.DateAxisRenderer
        highlighter:
            show: true
            sizeAdjust: 7.5
        series:
            lineWidth: 4
            label: series.Label
            markerOptions: 
                style: "square"
    )

JavaScriptに変換されたCoffeeScriptは次のとおりです...

$.jqplot("elemid", [["2013-02-01 01:30:28 AM", 97640000], ["2013-02-01 01:31:38 AM", 166270000]], {
  axes: {
    xaxis: {
      min: data.XAxisMin,
      max: data.XAxisMax,
      tickInterval: "1 month",
      tickOptions: {
        formatString: "%b %#d"
      },
      renderer: $.jqplot.DateAxisRenderer
    },
    yaxis: {
      min: 0,
      tickRenderer: $.jqplot.canvasAxisTickRenderer
    }
  },
  highlighter: {
    show: true,
    sizeAdjust: 7.5
  },
  series: {
    lineWidth: 4,
    label: series.Label,
    markerOptions: {
      style: "square"
    }
  }
});

jsfiddle を作成しましたが、実行できないようです。私は以前にjsfiddleを使用したことがないので、何か間違っていると確信しています...

http://jsfiddle.net/uM8yu/5/

私はyaxisでDateAxisRendererを試しましたが、時間は実際には日付/時間そのものではなく、誰かが完了するのにかかった時間、分、秒です。

どんな助けでも素晴らしいでしょう！

4

1 に答える 1

0

を設定するときはyaxis、次のものも指定する必要がありますtickOptions。

tickOptions: {
    formatter: function(format, value){
        return MillisecondsToDuration(value);
    }
}

これが行うことは、ティックがレンダリングされるたびにメソッドを実行することです ( JavaScript のタイムスパンの計算MillisecondsToDurationから適応)。

function MillisecondsToDuration(n) {
    var dtm = new Date();
    dtm.setTime(n);

    var hours = Math.floor(n / 3600000);
    var minutes = dtm.getMinutes();
    var seconds = dtm.getSeconds();

    return $.jqplot.sprintf('%02d:%02d:%02d', hours, minutes, seconds);        
}

上記の方法では、時間の値がミリ秒単位であると想定しています。そうでない場合は、これを調整する必要があります。は%02d、各値が最大 2 つの先行ゼロでフォーマットされることを意味します。

于 2013-02-02T07:02:25.920 に答える