Stack Overflow
Stack Overflow

Questions tagged [circle-pack]

In geometry, circle packing is the study of the arrangement of circles (of equal or varying sizes) on a given surface such that no overlapping occurs and so that all circles touch another.

187 questions
19
votes
4 answers

D3: Substituting d3.svg.diagonal() with d3.svg.line()

I have implemented the following graph with the edges rendered with d3.svg.diagonal(). However, when I try substituting the diagonal with d3.svg.line(), it doesn't appear to pull the target and source data. What am I missing? Is there something I…
Jakub Svec
  • 842
  • 2
  • 10
  • 20
11
votes
3 answers

Packing irregular circles on the surface of a sphere

I'm using Three.js to create points on a sphere, similar to the periodic table of elements example. My data set is circles of irregular size, and I wish to evenly distribute them around the surface of a sphere. After numerous hours searching the…
Jared
  • 607
  • 1
  • 6
  • 28
10
votes
1 answer

d3js dragging circle should rearrange other circles in main boundary circle

I have bubble chart based on this tutorial. I have enabled dragging of bubbles with following code. This makes individual circles draggable, but while dragging a circle other circles don't get auto adjusted. I am using pack circle algorithm, please…
Dhanesh Mane
  • 147
  • 11
10
votes
3 answers

Updating a layout.pack in d3.js

I am trying to wrap my mind around d3's pack layout (http://bl.ocks.org/4063530). I have the basic layout working but I would like to update it with new data. i.e. collect new data, bind it to the current layout.pack and update accordingly…
emepyc
  • 949
  • 1
  • 10
  • 23
9
votes
1 answer

Convert d3.js bubbles into forced/gravity based layout

I have a set of data that I am visualizing using d3.js. I am representing data points in the form of bubbles, where the configuration for bubbles is as follows: var dot = svg.selectAll("g") .data(data) .enter() …
user2480542
  • 2,845
  • 4
  • 24
  • 25
8
votes
1 answer

Placing dots in an arc

I have an arc and currently the dots that belong to that arc use d3.layout.pack() to place them, this however only places the dots in the arc in a circle obviously. Is there a way that I could place the dots in an arc to use the whole space of an…
markblue777
  • 829
  • 3
  • 13
  • 28
8
votes
0 answers

combining force and pack layouts in d3

I have a graph represented with a standard force layout. Nodes can be clustered by attributes. Can I represent these clusters with a pack layout? How will the 2 layouts coexist and how will the x and y coordinates of my nodes be calculated? edit I'm…
Renaud
  • 4,569
  • 7
  • 41
  • 72
8
votes
1 answer

D3 bubble chart / pack layout - How to make bubbles radiate out from the largest bubbles to the smallest?

So I am using the same code as this D3 gallery example (with my own data): http://bl.ocks.org/mbostock/4063269 I'd like to get a bubble chart where the circles are arranged with the biggest in the center and then radiating out to the smallest. …
SoldierOfFortran
  • 782
  • 1
  • 7
  • 14
8
votes
2 answers

How to match text width to circle size in D3 circle pack

Using D3 I display a bunch of circles in different sizes, each filled with text. I'm stuck with finding the correct font size so that the text fits correct in the circle, depending of it's size and the length of the text. Long text should possibly…
quape
  • 726
  • 9
  • 21
8
votes
1 answer

Tooltips for nested circles in D3 circle pack layout

I'm banging my head here. I want to display tooltips for the leaf nodes in a structure such as Zoomable Pack Layout. The leaf nodes are the brown ones. If I used the standard code for tooltips: vis.selectAll("circle") .data(nodes) .enter() …
Curtis Kelsey
  • 716
  • 8
  • 32
8
votes
2 answers

Possible to use a circle pack layout in d3.js with fixed circle sizes?

This circle pack layout example (http://bl.ocks.org/4063269) is perfect for a project I'm working on, however it sizes all the circles relative to one another: Is there a simple way to specify fixed radii for each circle? I've scoured the source…
user2058412
  • 81
  • 1
  • 2
7
votes
0 answers

Fix misleading circle sizes calculated by circle packing

I have created a circle packing layout with a large hierarchical dataset. The image below shows what it looks like. The number in each circle corresponds to the number of leaf nodes. Each leaf node is given an initial value of 1. The layout then…
Ivan Bacher
  • 5,855
  • 9
  • 36
  • 56
7
votes
2 answers

Zoomable Circle Packing with Automatic Text Sizing in D3.js

I'm trying to merge two of Mike's examples: Zoomable Circle Packing + Automatic Text Sizing. It works when initially displayed at the top-level. However, if you zoom in to the next level, the fonts are not sized correctly. I'm not sure if I need to…
Edward J. Stembler
  • 1,932
  • 4
  • 30
  • 53
7
votes
1 answer

Updating the data of a pack layout from JSON call and redrawing

I've been toying around with the circle pack sample. However, I have a lot of trouble trying to update the thing from a new set of JSON data and refreshing it afterwards. My code is just a modified version of the circle pack sample: var diameter =…
Alex Langberg
  • 163
  • 1
  • 8
7
votes
2 answers

D3 Bubble Example: What does bubble.nodes() do?

Example: http://mbostock.github.com/d3/ex/bubble.html I'm having a hard time understanding what goes on with line 16: .data(bubble.nodes(classes(json)) And why, or where within the classes() function, the variable classes[] gets x,y,r values…
kratsg
  • 600
  • 1
  • 5
  • 17
1
2 3
…
12 13