web-dev-qa-db-ja.com

d3.jsonコマンド内でd3.minおよびd3.maxを使用する方法

私はd3とJavascriptが初めてです。コロプレスの例を試しましたが、今度はさらに詳細な変更を行いたいと思います。その1つは、入力として使用しているJSONの最大値と最小値を見つけることです。

私の質問は簡単です。オブジェクトの下のコードスニペットはconsole.log（data）コマンドのコンソールに正しく出力されますが、オブジェクト全体はminおよびmaxステートメントだけでなくminおよびmaxステートメントにも出力されます最大.

d3.json("data/unemployment_by_state.json", function(data) {   
  console.log(data);
  console.log(d3.min([data]));
  console.log(d3.max([data]));
});

JSONオブジェクトのスニペットは次のとおりです。

{"01":32710,"02":20280,"03":18002}

D3.min（[data]）とd3.max（[data]）がデータオブジェクトの最小数と最大数の代わりにオブジェクト全体をコンソールに出力する理由を理解するだけで、私が助けてほしいのです。 。

前もって感謝します。

d3.js
29
mozdyv

d3.min()およびd3.max()関数は、オブジェクトではなく配列で動作します。 dataオブジェクトを配列（たとえばd3.max([data])）でラップすることでこれに対処しようとしているようですが、実際にこれを行っているのは、「配列の最大値を値（データオブジェクト）。」配列には値が1つしかないため、その値が返されます。

オブジェクトの最大/最小値だけが必要な場合は、d3.values()関数を使用してデータ内のすべての値を配列として抽出し、その配列の最大値を取得できます。

_var max = d3.max(d3.values(data)); 
// 32710
_

キーについても知りたい場合は、d3.entries()を使用して_{ key, value }_オブジェクトの配列を作成し、それらを並べ替えてトップを取得する必要があります。

_// create an array of key, value objects
var max = d3.entries(data)
    // sort by value descending
    .sort(function(a, b) { return d3.descending(a.value, b.value); })
    // take the first option
    [0];
// { key: "01", value: 32710 }
_
46
nrabinowitz

データが配列の場合、データを囲む括弧を削除すると、元のコードが機能します。

  var data = [32710,20280,18002];

  console.log(data);
  console.log(d3.min(data));
  console.log(d3.max(data));

キー「01」、「02」、「03」で配列値を識別する必要がある場合は、オブジェクトの配列を作成し、値を操作して最小/最大を取得します。

   //data as key/value pairs
   var data = [
     {key: "01",  value:  32710},
     {key: "02",  value:  20280},
     {key: "03",  value: 18002}
  ];

  console.log(data);
  console.log(d3.min(data, function(d) { return d.value; }));
  console.log(d3.max(data, function(d) { return d.value; }));

  // AND IF YOU WANT THE min/max of the KEYS:
  console.log(d3.min(data, function(d) { return d.key; }));
  console.log(d3.max(data, function(d) { return d.key; }));
49
mike

私もd3とJavaScriptに不慣れですが、d3.extentおよび.concat：

y.domain(
  d3.extent(
    d3.extent(data, function(d) {
      return d.line1;     })
    .concat(d3.extent(data, function(d) {
      return d.line2;     })
            .concat(d3.extent(data, function(d) {
      return d.line3;     })
                   ))
  ));
0
API