問題タブ [circle-pack]

ズーム可能な円のパッキング チャートを作成しようとしています。各子円に、常に同じ構造を持つ小さなグラフを含めたいと思います (つまり、4 つの列で、棒の高さだけが変わります)。

これまでのところ、チャートに単純なものを追加しようとしましたrectが、四角形は円に追加されておらず、静的です:

JS:

plunkr も追加しました: http://plnkr.co/edit/CfJqUQMISDzed2F71JpT?p=preview

この四角形を子サークル内にのみ追加するにはどうすればよいですか?

どうもありがとう

この一見単純なコードを機能させることができません。5 行のデータを含む csv ファイルがあり、そこからバブル チャートを作成しようとしています! 誰かが助けてくれれば本当に感謝します！

csv ファイルは次のとおりです。

私は D3 に少し慣れていないので、まだ理解に問題があります。

私はこのチュートリアルZoomable Circle Packingを使用しています:

ただし、複数のデータセットをロードする方法がわかりません。

たとえば、（jsfiddle で確認できます）のようなものが必要ですが、ボタンが押されると、別の .JSON ファイルがロードされます（両方のファイルの名前は同じですが、値は異なります）。

解決策は mbostock の「Thinking with Joins」かもしれませんが、使い方がよくわかりません。

どんな助けでも大歓迎です。

フラット サークル パック レイアウトをさまざまな json ファイルのデータで更新しようとしています。このチュートリアルのコードを自分のコードで動作するように調整しました: JSON 呼び出しからのパック レイアウトのデータの更新と再描画

「要素を検査」すると、データが更新されていることが示されますが、ノードはまだ最初の JSON ファイルに関連付けられています。「currentJson」ではなく「currentUrl」をコールバックするd3.jsonに関係していると感じています。どんな助けでも大歓迎です!!

これは私のgeneratenewdataコードです:

サークル パック レイアウトで円の半径を微調整することに興味があります。そのためには、元の半径がどのように計算されるかを知る必要があります。

パック レイアウトの d3.js ソース コードを読むと、デフォルトの半径関数は ノードごとに単純Math.sqrtなようです。valueしかし、実際にはそうではありません。これは、 D3.js の元のサークル パックの例 に を追加して変更したためです。bl.ocks.org/ecerulm/f0a36710e3.radius(function(d){return Math.sqrt(d);}) でわかるように、円の半径は同じではありません。

D3 を使用して、さまざまなサイズの円を多数表示し、それぞれにテキストを入力します。サイズとテキストの長さに応じて、テキストが円に正しく収まるように、正しいフォントサイズを見つけることに固執しています。長いテキストは、複数の行に分割する必要があります。これが私のコードです：

http://jsfiddle.net/L4nMx/でもフィドルを作成しました 。テキストの幅を計算し、円のサイズなどに一致するまでフォント サイズを変更する必要があると思います。または、これを簡単に行うための「ストレッチ」機能はありますか?