chartist.jsでタイムスタンプ付きデータを使用するには？

Question

私はx値がタイムスタンプであるデータセットを持っています。

タイムスタンプは不規則であるため、2016-12-13T00：01：02Zと他の2016-12-13T02：13：05Zとなります。

私はX軸は00 01 02を示すだろうという意味、一日が表示されているラインチャートには、このデータを描画したいと思います... 22 23 24

は、私はどのように行うだろうでそのchartist.js？

Answer 1

私はそれを自分で考え出しました。

私は2つのデータセットを使用します。私のデータを含むもの。もう一方（baseData）には、開始日と終了日の2つのタイムスタンプが含まれます。これは私がチャートに「baseData」を表示したくない... 00 01 02でX軸を描画する21 22

をチャートに強制されます - ので、私はCSSでそれを隠す：

.ct-series-a .ct-line { 
       /* Set the color for seriesDataTemperatures */ 
       stroke: green; 
       /* Control the thickness of seriesDataTemperatures */ 
       stroke-width: 1px; 
} 
.ct-series-b .ct-line { 
       /* Set the color for baseData */ 
       stroke: grey; 
       /* Control the thickness of baseData */ 
       stroke-width: 0px; 
} 

を

は、その後、私はこのように私のグラフを描く： `labelInterpolationFnc`で[値]が数値であれば

// My time-stamped series go here 
var seriesDataTemperatures = []; 

// This data-set will have two values, begin of day and end of day. 
// E.g. [{ x: new Date("2016-12-16T00:01:00.000Z").valueOf(), y: 0 }, { x: new Date("2016-12-16T23:59:00.000Z").valueOf(), y: 0}] 
var baseData = []; 

chartTemperatures = new Chartist.Line('.ct-chart-temperatures', { 
    series: [ 
       { 
        name: 'temperatures', 
        data: seriesDataTemperatures 
       }, 
       { 
        name: 'base', 
        data: baseData 
       } 
       ] 
}, { 
    showPoint: false, 
    lineSmooth: false, 
    axisX: { 
     type: Chartist.FixedScaleAxis, 
     divisor: 23, 
     labelInterpolationFnc: function (value) { 
      return moment(value).format('HH'); 
     } 
    } 
});