Jsonファイルの中の単語の数をカウントするコードの書き方が知りたいです
やりたいことは、例えば以下のようなJsonファイルがあった場合に、
[ {id:1, legend:"apple"}, {id:2, legend:"orange"}, {id:3, legend:"orange"}, {id:4, legend:"apple"}, {id:5, legend:"grape"}, {id:6, legend:"apple"}, . . . (以下200ほど同様のデータが続く) ];
legendに対応する単語(apple, orangeなど)の数をそれぞれカウントしたいのですが、どのようなコードを書けばよいのでしょうか?
最終的な目標としては、D3.jsというライブラリを用いて全体のうちappleが何パーセント、oranngeが何パーセント、という円グラフを作りたいと考えています。
が、まずはカウントする方法を知りたいと思っています。
どなたかお分かりの方がおりましたら、ご教示お願いいたします。
参考として、基礎的な円グラフの作り方としてhttp://bl.ocks.org/hunzy/9134534のような方法がありますので、そのコードを説明用に転載させていただきます。
このようなソースコードの中に、JSONファイルの単語それぞれが含まれる総数を計算するコードを加えたいと思っています。
<!doctype html> <html lang="ja"> <head> <meta charset="UTF-8"> <title>円グラフ</title> <script src="http://d3js.org/d3.v3.min.js" charset="utf-8"></script> </head> <body> <script> var dataset = [ {legend:"apple", value:10, color:"red"}, {legend:"orange", value:45, color:"orangered"}, {legend:"banana", value:25, color:"yellow"}, {legend:"peach", value:70, color:"pink"}, {legend:"grape", value:20, color:"purple"} ]; var width = 960; var height = 500; var radius = 200; var svg = d3.select("body").append("svg") .attr("width", width) .attr("height", height) .append("g") .attr("transform", "translate(" + width / 2 + "," + height / 2 + ")"); var arc = d3.svg.arc() .outerRadius(radius) .innerRadius(30); var pie = d3.layout.pie() .sort(null) .value(function(d){ return d.value; }); var g = svg.selectAll(".fan") .data(pie(dataset)) .enter() .append("g") .attr("class", "fan") g.append("path") .attr("d", arc) .attr("fill", function(d){ return d.data.color; }) g.append("text") .attr("transform", function(d) { return "translate(" + arc.centroid(d) + ")"; }) .style("text-anchor", "middle") .text(function(d) { return d.data.legend; }); </script> </body> </html>
これは、データの中身(つまりJsonファイルの中身)が以下のように、初めからappleがいくつ、orangeがいくつと計算されています。
dataset = [ {legend:"apple", value:10, color:"red"}, {legend:"orange", value:45, color:"orangered"}, {legend:"banana", value:25, color:"yellow"}, {legend:"peach", value:70, color:"pink"}, {legend:"grape", value:20, color:"purple"} ];
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2015/12/14 12:23