0

これは私を少し悩ませています。APIからいくつかのデータを取得するために、コールバックを使用してd3.get.jsonを作成しています。よく働く。次に、引数として円に渡そうとする変数にキー値を格納しています。そして、それはうまくいきません。円は描画されません。私が間違っていることを理解できないようです

これは私が持っているものです

d3.json("http://data.cityofnewyork.us/resource/xm9j-adfx.json", function(data) {

    var energy = JSON.parse(data[0].consumption_gj_)/1000; // I probably will figure out a better math function for this
    //alert(energy)
    var x_axis = 10;
    var y_axis = 10;

    var svgContainer = d3.select("#chart").append("svg")
    .attr("width", 300)
    .attr("height", 300)
    .style("background", "black");

    var circles = svgContainer.selectAll("circle")
                  .data(json)
                  .enter()
                  .append("circle");

        var circleAttributes = circles
        .attr("cx", function(d){return d.x_axis;} )
        .attr("cx", function(d){return d.y_axis;} )
        .attr("r", function(d){return d.energy;} )
        .style("fill", "red");

});

基本的には、半径をエネルギー変数の関数として円を描くという考え方です。

これが私のフィドルです

http://jsfiddle.net/sghoush1/KcWCr/5/

4

2 に答える 2

0

呼び出す必要がありますが、そうでは.data(data)なく.data(json)、円が描かれます。

この方法で円の属性を割り当てる必要があります。

.attr("cx", function(d){return d.x_axis;} )

于 2013-06-29T07:46:59.390 に答える