23

JSONを使用してカレンダーの視覚化にデータを読み込もうとしています。現時点では、CSVファイルを使用するとうまく機能します。

d3.csv("RSAtest.csv", function(csv) {
  var data = d3.nest()
    .key(function(d) { return d.date; })
    .rollup(function(d) { return d[0].total; })
    .map(csv);

 rect.filter(function(d) { return d in data; })
      .attr("class", function(d) { return "day q" + color(data[d]) +
"-9"; })
      .select("title")
      .text(function(d) { return d + ": " + data[d]; });

});

次のCSVデータを読み取ります。

date,total
2000-01-01,11
2000-01-02,13
.
.
.etc

代わりに次のJSONデータを読み取る方法に関するポインタ： {"2000-01-01":19,"2000-01-02":11......etc}

私は次のことを試しましたが、うまくいきませんでした（datareadCal.phpがJSONを吐き出します）：

d3.json("datareadCal.php", function(json) {
  var data = d3.nest()
    .key(function(d) { return d.Key; })
    .rollup(function(d) { return d[0].Value; })
    .map(json);

ありがとう

4

2 に答える 2

13

d3.entries()を使用して、オブジェクト リテラルをキーと値のペアの配列に変換できます。

var countsByDate = {'2000-01-01': 10, ...};
var dateCounts = d3.entries(countsByDate);
console.log(JSON.stringify(dateCounts[0])); // {"key": "2000-01-01", "value": 10}

ただし、結果の配列が適切にソートされていないことに気付くでしょう。次のように、キーの昇順で並べ替えることができます。

dateCounts = dateCounts.sort(function(a, b) {
    return d3.ascending(a.key, b.key);
});
于 2012-04-09T17:50:21.410 に答える
6

.json ファイルを、html ファイルに含まれる .js ファイルに変換します。.js ファイル内には次のものがあります。

var countsByDate = {'2000-01-01':10,...};

その後、 countsByDate を参照できます....ファイル自体から読み取る必要はありません。

そして、あなたはそれを読むことができます：

var data = d3.nest()
.key(function(d) { return d.Key; })          
.entries(json);

余談ですが....d3.jsは、jsonを次のように設定する方が良いと言っています：

var countsByDate = [
  {Date: '2000-01-01', Total: '10'},
  {Date: '2000-01-02', Total: '11'},
];
于 2012-04-12T14:49:33.893 に答える