1

http://bl.ocks.org/mbostock/4061502を参照して、JSON からデータを読み取るボックス プロットを実装してみました。csvから読み込むコードは

d3.csv("morley.csv", function(error, csv) {
var data = [];

csv.forEach(function(x) {
var e = Math.floor(x.Expt - 1),
    r = Math.floor(x.Run - 1),
    s = Math.floor(x.Speed),
    d = data[e];
if (!d) d = data[e] = [s];
else d.push(s);
if (s > max) max = s;
if (s < min) min = s;
});

csv データ:

Expt,Run,Speed
1,1,850
1,2,740
1,3,900
1,4,1070
1,5,930
1,6,850
1,7,950
1,8,980
1,9,980
1,10,880

次のように、csv を json に置き換えました。

d3.json("morley.json", function(json) {
var data = json.data;
var ChartData = [];// Should Contain speed values
data.forEach(function(d,i){
  chartData.push(d.Speed);
});   
var min = d3.min(data, function(d){return d.Speed});
var max = d3.max(data, function(d){return d.Speed})

私のjsonは次のとおりです。

{
"data": [
    {
        "Expt": 1,
        "Run": 2,
        "Speed": 850
    },
    {
        "Expt": 1,
        "Run": 3,
        "Speed": 740
    },
    {
        "Expt": 1,
        "Run": 4,
        "Speed": 900
    },
    {
        "Expt": 1,
        "Run": 5,
        "Speed": 1070
    },
    {
        "Expt": 1,
        "Run": 6,
        "Speed": 930
    }]
}

d3.box メソッドを呼び出すとき

 var chart = d3.box()
            .whiskers(iqr(1.5))
            .width(width)
            .height(height); 

d3.box = function() {

// For each small multiple…
function box(g) {
g.each(function(d, i) {
    alert(d);
  d = d.map(value).sort(d3.ascending); // error at this line saying object dont have method map
  alert(d);
  var g = d3.select(this),
      n = d.length,
      min = d[0],
      max = d[n - 1];

csv から読み取ったときにエラーが発生しませんが、JSON から読み取ると、このオブジェクトにはメソッド マップ エラーがありません。違いはなんですか？

4

2 に答える 2

0

こんなものでしょう

{
     "Speed": [850, 740, ...],
     "Expt": [1, 1, ...],
     "Run": [1, 2, ...]
}

json.speed2 番目の引数を省略した場合、これが意味のある唯一の方法でありd3.min/max、期待される結果を返します。

あなたのデータ構造では、最小速度を得るために正しいコマンドは

d3.min(json.data, function(d) { return d.Speed; });
于 2013-08-13T13:06:55.250 に答える