タイムスタンプから日/週/月単位で線グラフを描画

Question

私のウェブサイトの訪問ログを分析したい。ウェブサイトにはmoment.jsの配列が格納されており、ウェブサイトに新しい訪問があるたびにmoment.js時間が配列にプッシュされます。

その入力から、私はnumber of visitsday by day、week by weekとmonth by monthを表示する折れ線グラフを描きたいです。日ごとの訪問日の数を示すのthis exampleにおいて、自分で（x軸とy軸の）データを準備する必要があります

var enumerateDaysBetweenDates = function(startDate, endDate) { 
    var dates = {}; 
    var currDate = startDate.clone().startOf('day').add(-1,'days'); 
    var lastDate = endDate.clone().startOf('day'); 
    while(currDate.add(1, 'days').diff(lastDate) <= 0) { 
     var x = currDate.clone(); 
     dates[x.format('YYYY-MM-DD')] = { "numberOfVisits": 0 }; 
    } 
    return dates; 
}; 

var startDate = moment({ year : 2017, month : 10, day : 1 }); 
var endDate = moment({ year : 2017, month : 10, day : 30 }); 
var res = enumerateDaysBetweenDates(startDate, endDate) 
for (var i = 0; i < logs.length; i++) { 
    var date = moment.utc(logs[i]).format("YYYY-MM-DD"); 
    res[date].numberOfVisits++ 
} 

// change format: 
var r = []; 
for (var d in res) { 
    if (res.hasOwnProperty(d)) { 
     var a = d.split("-"); 
     var b = Date.UTC(a[0], a[1] - 1, a[2]); 
     r.push([b, res[d].numberOfVisits]) 
    } 
} 

数週間または数ヶ月のためにグラフを描画するには、私は再しなければなりませんデータを準備します。チャートを自動的に描くことを可能にする方法、パラメータ、またはライブラリがあれば、誰にも分かりますか？

PS：ここan example by chart.js

Answer 1

があるHighstockは、あなたが探しているもののようですdataGroupig機能を提供します。

ライブデモ：http://jsfiddle.net/kkulig/avd0gqgr/

私は、データのグループ化を強制し、ボタンのクリックでそのユニットを上書きしました。

//options 
    xAxis: { 
    ordinal: false 
    }, 

    plotOptions: { 
    series: { 
     dataGrouping: { 
     forced: true, 
     approximation: 'sum' 
     } 
    } 
    }, 
(...) 

// button 
$('#months').click(function() { 
    chart.update({ 
    plotOptions: { 
     series: { 
     dataGrouping: { 
      units: [ 
      [ 
       'month', [1] 
      ] 
      ] 
     } 
     } 
    } 
    }); 
}); 

---

APIリファレンス：https://api.highcharts.com/highstock/plotOptions.series.dataGrouping

ドキュメント参照：https://www.highcharts.com/docs/advanced-chart-features/data-grouping