score:2
I have figured out a way to do stacked pie charts in D3. I'm not entirely sure if this is the "correct" convention, but it certainly works well. Here's a fiddle to follow along with.
I've restructured my yeas
and nays
arrays into specifying the data value at the first level (this way, D3 can properly loop) in an object and then also including party and name alongside. Here's an example of how the yeas
array looks:
Essentially there's two arrays, yeas
and nays
, each having 9 objects withs values: value
, party
, and name
. This way I can pass d3.layout.pie
the data of either of the arrays and give the value
in that pie layout d.value
. More simply said, here's the code snippet to explain:
var yea_pie = d3.layout.pie()
.sort(null)
.value(function(d) { return d.value; }) //This computes a pie value for each yeas.value (d.value)
.startAngle(-Math.PI/2)
.endAngle(Math.PI/2);
var yeas_industry = yea_group.selectAll('.arc')
.data(yea_pie(yeas)) //Pass the yeas variable to yea_pie
.enter().append('g')
.attr('class', 'arc');
This is really the only solution I've ever seen to doing a stacked pie chart. With that said, I'll mark this correct, but if any one else thinks of a better way, I'd be interesting in knowing.
Source: stackoverflow.com
Related Query
- D3.JS Grouped Donut Chart from JSON
- D3: Create a grouped bar chart from json objects
- D3.js : How to read data from JSON in Grouped Bar Chart
- grouped bar chart from JSON data instead of CSV
- D3.js - Create multi-ring donut chart dataset from JSON
- Grouped Bar Chart From JSON D3.JS
- modifying d3.js donut chart to read from json array
- D3 drawing a second donut chart from nested JSON
- D3 multi-series line chart from pivoted JSON
- Convert a d3 chart to load data from json inside a variable
- D3.js update bar chart from json
- prevent d3 donut chart from sorting automatically
- d3js pie graph from jquery ajax - correlating json keys and values on the chart
- d3 multiline chart from JSON
- How to create vertically grouped bar chart in d3.js using json data?
- D3 Grouped Bar Chart with JSON nested data
- d3 v4 Stacked to Grouped Bar Chart from CSV
- Javascript d3 pie chart doesn't pull data from JSON file with list of dictionaries
- How to load data to D3 chart from JSON when there are only tuples
- c3js Stacked Bar chart from json array
- D3 dashboard chart data bind from json or csv
- How to tell d3js that this half donut chart should fill values from left to right corner
- D3 Chart values are not grouped (from JSON load)
- bubble chart width and height set dynamically from json data in d3.js
- D3 Grouped Bar Chart From Arrays
- D3js multiple line chart from json file
- d3 json nest data mapping, grouped bar chart
- data not bind from json for d3 chart
- D3.js Grouped bar chart with JSON data
- D3 - Polylines from label to arc in Donut or Pie Chart
More Query from same tag
- D3.remove() is not working properly with c3-axis (I don't want to hide it)
- How to Build this Rounded Two Tone Donut Chart?
- Label text of pie chart not appearing
- Updating Donut Graph Using d3.js
- array1.splice(1,1) is removing data from array2 which I have created using array1.slice(0)
- D3js text not reading from database data
- how to visualize data from mysql database in force layout of d3 tool
- How can one scale GIS data in d3.js?
- What are invalid values when setting style properties in IE9?
- How to know if topojson is installed and working normally?
- D3: enter(), exit() on mouseover/mouseout
- Horizontal Bar chart using d3 js
- Hierarchy Level labels for d3.partition icicle chart
- Calculate height and with of a group in D3
- add custom class dynamically to dc.selectMenu; IE11 removes it
- Wiring events for reusable d3 time slider
- How can I change the size of the innermost circle in a D3 zoomable sunburst?
- Enable scroll on the axis of D3 chart
- Process and send mouse event beneath the SVG element
- Adding legends to d3.js line charts
- D3.js updating a stacked bar chart
- d3.js - Transform hex color into darker tone hex color
- Colored text and line-breaks for D3 node labels
- How to size circles in pack layout correctly
- D3 stacked area chart stack function
- Why can't I access my JavaScript array by index outside of the d3 then function?
- Passing data from Django view to D3
- D3.js dynamically switching between number and dollar formats on tick marks
- D3 tree with boxes
- How can we add legend's value beside of legend with proper alignment and different color in dc.js