Pie chart

addon/components/e3-shape/arc.js

@@ -0,0 +1,14 @@
+import e3AnimatedChild from '../e3-animated-child';
+
+export default e3AnimatedChild.extend({
+  shadowType: 'arc',
+  enterState: {},
+  activeState: {
+    x: 0,
+    y: 0,
+    'start-angle': 0,
+    'angle': 0,
+    'inner-radius': 0,
+    'outer-radius': null
+  }
+});

addon/helpers/e3-extent.js

@@ -9,6 +9,7 @@ const {get} = Ember;
  Options {
   key => the property key of where the value sits on each of the items in the array
   padding => A percent (0-1) of the found extent to be "padded" to both ends of the extent
+  sum => A flag to determine wether we should take the sum of the values.
   min-value => The minimum possible value (clips actual values lower than it)
   max-value => The maximum possible value (clips values higher than it)
   min-delta => Forces the different between the min and max to be at least a certain value.
@@ -24,6 +25,7 @@ export function e3Extent(params, hash) {
   }
 
   let key = hash.key;
+  let sum = hash['sum'];
   let nestedKey = hash['nested-key'];
   let nestedSum = hash['nested-sum'];
   let length = arr.length;
@@ -57,12 +59,23 @@ export function e3Extent(params, hash) {
   length = arr.length;
   index = -1;
 
-  // Iterate over the array and figure out min/max values.
-  while(++index < length) {
-    // If there's a key to map, get that value.
-    let cur = key ? get(arr[index], key) : arr[index];
-    result[0] = Math.min(result[0], cur);
-    result[1] = Math.max(result[1], cur);
+  if(sum) {
+    let sumVal = 0;
+    while(++index < length) {
+      let cur = key ? get(arr[index], key) : arr[index];
+      sumVal += cur;
+    }
+
+    result[0] = 0;
+    result[1] = Math.max(result[1], sumVal);
+  } else {
+    // Iterate over the array and figure out min/max values.
+    while(++index < length) {
+      // If there's a key to map, get that value.
+      let cur = key ? get(arr[index], key) : arr[index];
+      result[0] = Math.min(result[0], cur);
+      result[1] = Math.max(result[1], cur);
+    }
   }
 
   // Apply the padding.

addon/helpers/e3-radian-range.js

@@ -0,0 +1,10 @@
+import Ember from 'ember';
+let twoPI = 2 * Math.PI;
+
+export function e3RadianRange(params, hash = {}) {
+  let startPercent = 'start' in hash ? hash.start : 0;
+  let endPercent = 'end' in hash ? hash.end : 1;
+  return [startPercent * twoPI, endPercent * twoPI];
+}
+
+export default Ember.Helper.helper(e3RadianRange);

addon/mixins/e3-scale.js

@@ -62,7 +62,13 @@ export default Ember.Mixin.create({
    do something to this.
    */
   getDomain() {
-    return this.getAttr('domain');
+    let domain =  this.getAttr('domain');
+
+    if(!isArray(domain)) {
+      domain = [0, domain];
+    }
+
+    return domain;
   },
 
   /*

addon/utils/shadow/line-interpolation/monotone.js

@@ -1,4 +1,5 @@
 const {abs} = Math;
+import { Point, SmoothCurve, BezierCurve } from '../types/commands';
 
 /**
 * Returns an array of arguemnts for commands
@@ -11,7 +12,10 @@ export default function monotone(points) {
     return points;
   }
 
-  return [points[0]].concat(d3_svg_lineHermite(points, d3_svg_lineMonotoneTangents(points)));
+  var commands = [];
+  commands.push(new Point(points[0][0], points[0][1]));
+  var hermite = d3_svg_lineHermite(points, d3_svg_lineMonotoneTangents(points));
+  return commands.concat(hermite);
 }
 
 /*
@@ -90,12 +94,14 @@ function d3_svg_lineHermite(points, tangents) {
       pi = 1;
 
   if (quad) {
-    commands.push([
-      p[0] - t0[0] * 2 / 3,
-      p[1] - t0[1] * 2 / 3,
-      p[0],
-      p[1]
-    ]);
+    commands.push(
+      new SmoothCurve(
+        p[0] - t0[0] * 2 / 3,
+        p[1] - t0[1] * 2 / 3,
+        p[0],
+        p[1]
+      )
+    );
     p0 = points[1];
     pi = 2;
   }
@@ -104,40 +110,46 @@ function d3_svg_lineHermite(points, tangents) {
     t = tangents[1];
     p = points[pi];
     pi++;
-    commands.push([
-      p0[0] + t0[0],
-      p0[1] + t0[1],
-      p[0] - t[0],
-      p[1] - t[1],
-      p[0],
-      p[1]
-    ]);
+    commands.push(
+      new BezierCurve(
+        p0[0] + t0[0],
+        p0[1] + t0[1],
+        p[0] - t[0],
+        p[1] - t[1],
+        p[0],
+        p[1]
+      )
+    );
 
     for (var i = 2; i < tangents.length; i++, pi++) {
       p = points[pi];
       t = tangents[i];
       let lt = tangents[i - 1];
       let lp = points[i - 1];
 
-      commands.push([
-        lp[0] + lt[0], // Add the last tangent but reflected
-        lp[1] + lt[1],
-        p[0] - t[0],
-        p[1] - t[1],
-        p[0],
-        p[1]
-      ]);
+      commands.push(
+        new BezierCurve(
+          lp[0] + lt[0], // Add the last tangent but reflected
+          lp[1] + lt[1],
+          p[0] - t[0],
+          p[1] - t[1],
+          p[0],
+          p[1]
+        )
+      );
     }
   }
 
   if (quad) {
     var lp = points[pi];
-    commands.push([
-      p[0] + t[0] * 2 / 3,
-      p[1] + t[1] * 2 / 3,
-      lp[0],
-      lp[1]
-    ]);
+    commands.push(
+      new SmoothCurve(
+        p[0] + t[0] * 2 / 3,
+        p[1] + t[1] * 2 / 3,
+        lp[0],
+        lp[1]
+      )
+    );
   }
 
   return commands;

addon/utils/shadow/line-interpolation/path-commands.js

@@ -1,12 +1,15 @@
 import monotone from './monotone';
+import { Point } from './monotone';
 
 export default function generatePath(xPoints, yPoints, interpolation = 'linear') {
 
   var points = _zipPoints(xPoints, yPoints);
   var commands;
   switch(interpolation) {
     case 'linear':
-      commands = points;
+      commands = points.map(point => {
+        return new Point(point[0], point[1]);
+      });
       break;
     case 'monotone':
       commands = monotone(points);

addon/utils/shadow/types/canvas.js

@@ -49,6 +49,25 @@ export default {
     return parentContext;
   },
 
+  arc(parentContext, selfContext, attrs, matrix) {
+    preShape(parentContext, attrs, matrix);
+    /*
+     attrs = {
+      x: {X Center},
+      y: {Y Center},
+      'start-angle': {In Radians},
+      'angle': {In Radians},
+      'inner-radius': {Defaults to 0},
+      'outer-radius': {Number}
+     }
+
+     Should accept these as arguments to construct a path array (shared with SVG);
+     Path array converts into commands...maybe pathFromCommands should support Arc commands?
+     */
+    postShape(parentContext, attrs, matrix);
+    return parentContext;
+  },
+
   stage(parentContext, selfContext, attrs) {
     if(!selfContext) {
       selfContext = parentContext.getContext('2d');

addon/utils/shadow/types/commands.js

@@ -0,0 +1,51 @@
+// gets set to move for the first command and line for all others
+export function Point(x, y) {
+  this.type = 'point';
+  this.x = x;
+  this.y = y;
+}
+
+export function Move(x, y) {
+  this.type = 'move';
+  this.x = x;
+  this.y = y;
+}
+
+export function Line(x, y) {
+  this.type = 'line';
+  this.x = x;
+  this.y = y;
+}
+
+export function SmoothCurve(x2, y2, x, y) {
+  this.type = 'smooth-curve';
+  this.x2 = x2;
+  this.y2 = y2;
+  this.x = x;
+  this.y = y;
+}
+
+export function BezierCurve(x1, y1, x2, y2, x, y) {
+  this.type = 'bezier-curve';
+  this.x1 = x1;
+  this.y1 = y1;
+  this.x2 = x2;
+  this.y2 = y2;
+  this.x = x;
+  this.y = y;
+}
+
+export function Arc(rx, ry, xAxisRotation, largeArcFlag, sweepFlag, x, y) {
+  this.type = 'arc';
+  this.x = x;
+  this.y = y;
+  this.xAxisRotation = xAxisRotation;
+  this.largeArcFlag = largeArcFlag;
+  this.sweepFlag = sweepFlag;
+  this.rx = rx;
+  this.ry = ry;
+}
+
+export function Close() {
+  this.type = 'close';
+}

addon/utils/shadow/types/svg.js

@@ -2,6 +2,7 @@ import Ember from 'ember';
 import {toArray} from '../matrix-math';
 import pathCommands from '../line-interpolation/path-commands';
 import pathFromCommands from './svg/path-from-commands';
+import arcSvgCommands from './svg/arc-svg-commands';
 import ATTRIBUTE_MAP from './svg-attribute-map';
 const {keys} = Object;
 const {copy} = Ember;
@@ -55,6 +56,21 @@ export default {
     return selfContext;
   },
 
+  arc(parentContext, selfContext, attrs) {
+    selfContext = preRender(selfContext, parentContext, 'path');
+    var commands = arcSvgCommands(
+      attrs.x,
+      attrs.y,
+      attrs['start-angle'],
+      attrs['angle'],
+      attrs['inner-radius'],
+      attrs['outer-radius']
+    );
+    attrs.d = pathFromCommands(commands);
+    renderAttributes('path', selfContext, attrs);
+    return selfContext;
+  },
+
   stage(parentContext/*, selfContext, attrs*/) {
     return parentContext;
   },