2012-07-26 23 views
8

非常に単純なd3チュートリアルの後に問題が発生します。私はすでに3を持っているので、それのように思えるd3追加して問題を入力してください

var svg =d3.select("body").selectAll("svg"); 
var circle = svg.selectAll("circle"); 
var w=window.innerWidth; 
console.log(circle); 
circle.data([500,57,112,200,600,1000]); 


circle.enter().append("circle") 
    .attr("cy",function(d) { 
     return (d) 
     }) 
    .attr("cx", function(i){ 
     return (i*100) 
    }) 
    .attr("r", function(d) { 
     return Math.sqrt(d); 
     }) 

(3つの新しいサークル要素を追加します。以下に示すように基本的に私はその後enter.append呼び出して、現在のSVGサークル要素にデータを結合することによってSVGサークル要素を追加しようとしています作成した)。代わりに、これらの3つの新しいサークル要素を追加取得するしかし、私はこのエラーに実行しています:

Uncaught TypeError: Object [object SVGCircleElement],[objectSVGCircleElement],[object SVGCircleElement] has no method 'enter'

私はパラグラフで、本質的に同じことを行っている、正常に動作するようです:

var p =d3.select("body").selectAll("p") 
.data([4, 8, 15, 16, 23, 42]) 
.text(function(d) { return "I'm number " + d + "!"; }); 

//Enter  
p.enter().append("p") 
.text(function(d) { return "I'm number " + d + "!"; }) 
.style("color", function(d, i) { 
return i % 2 ? "#000" : "#eee"; 
}); 

しかし、SVG要素を追加しようとすると、同じエラーが発生します。

文法エラーなどがあるはずですが、私は5兆回のコードを実行して何も見つかりませんでした。

ご協力いただきまして誠にありがとうございます。

アイザック

答えて

14

あなたはcircle.data代わりのcircle自体の結果にenterを呼びたいです。

var circle = svg.selectAll("circle"); 
circle.data([500,57,112,200,600,1000]).enter().append("circle"); 

あなたはp変数にdataのリターンを格納することによって、あなたのp例で正しくこれをしませんでした。 circleの例では、d3.select.selectAllの戻り値をcircle変数に格納しています。

+0

ありがとうございます!それは私のエラーを取り除き、完璧な意味を持っています。あなたはすでに二回私を救ってくれました。 – Cabbibo

+0

@IsaacCohen問題ありません。この質問に他の問題がない場合は、回答を受け入れてください。 –

+0

あまりにも長くかかって申し訳ありませんが、それを受け入れるようにしましたが、1時間は私を放置してしまい、気を散らして忘れてしまいました。謝罪いたします! – Cabbibo

関連する問題