1

私はd3でプロジェクトを行っており、つぶやきをグラフ化するための頻度グラフを描く方法について頭を悩ませています。だから、基本的に、私はこのような形式のJSONファイルを持っています

{
    "text": "ここにテキスト",
    "time": "ここにタイムスタンプ",
    "timezone": "ここのタイムゾーン",
    "retweet_count": いくつかの数,
    "ハッシュタグ": "ここにテキスト"
}

そのため、特定の期間のツイート数を示すグラフを d3 で描画する必要があります。たとえば、日付 X と日付 Y の間に、1 日あたりのツイート数がグラフに表示されます。

誰かがこれで私を助けることができますか? 私は本当にd3が初めてです。

4

1 に答える 1

3

d3 時間スケールと間隔を一緒に使用して、ビニングを行うことができるはずです。何かのようなもの：

var data= [
  {time: 'Jan. 1, 2012 13:00', name:"test", value:2},
  {time: 'Jan. 2, 2012 9:00', name:"test", value:2},
  {time: 'Jan. 3, 2012 14:00', name:"test", value:2},
  {time: 'Jan. 1, 2012 12:30', name:"test", value:2},
  {time: 'Jan. 3, 2012 1:00', name:"test", value:2},
  {time: 'Jan. 3, 2012 1:10', name:"test", value:2},
  {time: 'Jan. 3, 2012 1:20', name:"test", value:2},
  {time: 'Jan. 3, 2012 2:00', name:"test", value:2},
  {time: 'Jan. 1, 2012 3:00', name:"test", value:2},
];

// Get the date range from the data - could also be hardcoded
var dateRange = d3.extent(data, function(d) { return new Date(d.time); });
console.log("Data range", dateRange); // This will output your data's time range

// This will compute time bins
var binner = d3.time.scale();

// Pick the interval I want to bin on
var interval = d3.time.day; // Use hour, or minute, etc.      

// I will compute the number of the time intervals I want  
var allIntervals = interval.range(interval.floor(dateRange[0]), interval.ceil(dateRange[1]));
console.log("Intervals", allIntervals); // This will output an array of all the days/hours/whatever between min and max date

// Input domain mapped to output range
binner.domain([allIntervals[0], allIntervals[allIntervals.length - 1]]);
binner.range([0,allIntervals.length - 1]);

// Make sure we only output integers - important because we will fill an array
binner.interpolate(d3.interpolateRound);

// Empty histogram
var hist = [];
for(var i=0; i < allIntervals.length; i++) hist[i] = 0;

data.forEach(function(d) {
  // Compute the hour index
  var tid = binner(interval.floor(new Date(d.time)));
  console.log("Map " + d.time + " to " + tid);

  if(!hist[tid]) {
    hist[tid] = 1;
  } 
  else { 
    hist[tid]++;
  }
});

// Here is the histogram.
console.log("Hist:",hist);

ここで非常に初歩的なヒストグラム vis と組み合わせます。

おそらく interval.range(...) 呼び出しを代わりにミリ秒単位の計算に置き換えてパフォーマンスを向上させることができますが、たとえばツールチップなどを実行したい場合は、すべての値を持っていると便利です。

于 2013-01-07T22:54:14.940 に答える