circle-pack

问题 I am trying to make a zoomable circle packing chart. I'd like each child circle to contain a smaller chart which would always have the same structure (i.e. 4 columns, only the heights of the bars would change). I have tried adding a simple rect to my chart so far but the rects are not added in the circle and are statics: JS: var margin = 20, diameter = 400; var color = d3.scale.linear() .domain([-1, 5]) .range(["hsl(152,80%,80%)", "hsl(228,30%,40%)"]) .interpolate(d3.interpolateHcl); var pack

问题 I managed to create a bubble chart which works fine when it is a single dataset. But something goes wrong if I need to update it with other datasets. Please help me with my update function at http://jsfiddle.net/9jL64/. function changebubble(root) { var node = svg.selectAll(".node") .data(bubble.nodes(classes(root)) .filter(function(d) { return !d.children; })); node.enter() .append("g") .attr("class", "node") .attr("transform", function (d) { return "translate(" + d.x + "," + d.y + ")"; });

问题 I implemented my own version of https://bl.ocks.org/mbostock/7607535, but I would like to fill in the white circles with colors representing the data I am dealing with. For example some of the children in my json look like this: I would like to fill in the white circles with the numerical numbers displayed. I have access to those numbers in my code. Is there a way for me to fill in the color for each circle that can also represent negative numbers? In order to see a working version of this

问题 I need to create a legend for the bubble/circle pack chart. I'm displaying the values inside the circle. I need the names as the legend. For an instance, in the below provided data, if the value is 60, i need that name "Petrol" in the legend. How could i achieve it? Snippet: var diameter = 200, format = d3.format(",d"), color = ["#7b6888", "#ccc", "#aaa", "#6b486b"]; var bubble = d3.layout.pack().size([diameter, diameter]); var svg = d3.select("#bubbleCharts").append("svg") .attr("width",

问题 Closed . This question needs to be more focused. It is not currently accepting answers. Want to improve this question? Update the question so it focuses on one problem only by editing this post. Closed 4 years ago . I would like to create something like the image below but instead of the circles I would like to use images of emoji's (the whatsapp emoticons etc.) The data I would like to extract from the JSON should look something like this: { 'url': 'see-no-evil.png', 'hits': 456 }, { 'url':

问题 I am using the Zoomable Pack Layout provided on the D3 website: http://mbostock.github.io/d3/talk/20111116/pack-hierarchy.html All labels of the circles are displayed when the layout is displayed. The problem is that for small circles which are close together, the labels overlap. I would like to know if there is a way to hide the overlapping text of the labels? I have read about "foreignobject", but if this is the answer, I am not sure how and where to incorporate it in the code. 回答1: You

问题 I'm trying to make a circle packing chart using d3.js. The problem is that nodes have NaN values in the x and y properties, so all the circles have transform=" translate(NaN,NaN) " Json Data: var data = { "name": "flare", "children": [ { "name": "analytics", "children": [ { "name": "cluster", "children": [ {"name": "AgglomerativeCluster", "size": 3938}, {"name": "CommunityStructure", "size": 3812}, ] }, { "name": "graph", "children": [ {"name": "BetweennessCentrality", "size": 3534} ] }] }] }

问题 I am trying to label some circles in a circle pack layout with text that flows along the circle itself. Here is one experimental jsfiddle: As you can see, it is possible to render text along the circle, centered at its top. Though browser's rendering of curved SVG text is terrible. But let's say we don't care about it. Here is another jsfiddle I would like to place curved labels on this graph, under these conditions: The circle represents a province (only depth==1) (BRITISH COLUMBIA, ALBERTA,

问题 I'm trying to write a program in Python with Shapely that takes in shape files (right now congressional districts) and "packs" them with circles. The end goal is to have the center points and radii of the circles. I'd like to cover the maximum area with the least amount of circles. All of the resources I've found via Google so far are about circle packing within standard geometric objects like squares/circles/triangles etc... So my instinct is to try and turn these shapes into triangles or

问题 I try to use http://mbostock.github.com/d3/ex/bubble.html but with changed colors. I would like to find out how the colors are set in d3.layout.pack. 回答1: In the example you mentioned, the circle color is defined here: .style("fill", function(d) { return fill(d.packageName); }); Here, d is the data, bound to the circle. Instead of color, in this example the function passes an object (packageName attribute of d ). Each object gets own unique color assigned to it, according to selected color