first commit

2022-05-31 16:21:53 -04:00
commit f76abffdcd
5978 changed files with 1078901 additions and 0 deletions
@@ -0,0 +1,74 @@
+/* ------------------------------------------------------------------------------
+ *
+ *  # D3.js - multiple pie charts
+ *
+ *  Demo d3.js multiple pie charts setup
+ *
+ *  Version: 1.0
+ *  Latest update: August 1, 2015
+ *
+ * ---------------------------------------------------------------------------- */
+
+$(function () {
+
+    // Initialize chart
+    pieMultiple('#d3-pie-multiple', 110, 10);
+
+    // Chart setup
+    function pieMultiple(element, radius, margin) {
+
+
+        // Basic setup
+        // ------------------------------
+
+        // Define the data as a two-dimensional array of numbers
+        var data = [
+            [11975,  5871, 8916, 2868],
+            [ 1951, 10048, 2060, 6171],
+            [ 8010, 16145, 8090, 8045],
+            [ 1013,   990,  940, 6907]
+        ];
+
+        // Colors
+        var colors = d3.scale.category10();
+
+
+        // Create chart
+        // ------------------------------
+
+        // Insert an svg element (with margin) for each row in our dataset
+        var svg = d3.select(element)
+            .selectAll("svg")
+            .data(data)
+            .enter()
+            .append("svg")
+                .attr("width", (radius + margin) * 2)
+                .attr("height", (radius + margin) * 2)
+                .append("g")
+                    .attr("class", "d3-arc")
+                    .attr("transform", "translate(" + (radius + margin) + "," + (radius + margin) + ")");
+
+
+        // Construct chart layout
+        // ------------------------------
+
+        // Arc
+        var arc = d3.svg.arc()
+            .innerRadius(0)
+            .outerRadius(radius);
+
+
+        //
+        // Append chart elements
+        //
+
+        // The data for each svg element is a row of numbers (an array)
+        svg.selectAll("path")
+            .data(d3.layout.pie())
+            .enter()
+            .append("path")
+                .attr("d", arc)
+                .style("stroke", "#fff")
+                .style("fill", function(d, i) { return colors(i); });
+    }
+});