fix ellipse draw bug and fix shape props context

Example/examples/G.js

@@ -30,6 +30,7 @@ class GExample extends Component{
                 <Circle
                     cx="25"
                     cy="75"
+                    stroke="red"
                 />
                 <Circle
                     cx="50"
@@ -39,6 +40,7 @@ class GExample extends Component{
                 <Circle
                     cx="75"
                     cy="25"
+                    stroke="red"
                 />
                 <Circle
                     cx="75"

elements/Circle.js

@@ -3,7 +3,7 @@ import React, {
     PropTypes
 } from 'react-native';
 import Shape, {CIRCLE} from './Shape';
-import {circleProps, pathProps} from '../lib/props';
+import {circleProps, pathProps, fillProps, strokeProps} from '../lib/props';
 import _ from 'lodash';
 
 class Circle extends Shape{
@@ -13,13 +13,9 @@ class Circle extends Shape{
         ...circleProps
     };
 
-    static defaultProps = {
-        cx: 0,
-        cy: 0,
-        r: 0
-    };
-
     static contextTypes = {
+        ...fillProps,
+        ...strokeProps,
         ...circleProps,
         isInGroup: PropTypes.bool
     };

elements/Defs.js

@@ -61,11 +61,10 @@ class DefsUse extends Component{
             if (matched) {
                 let template = map[matched[1] + ':' + this.props.svgId];
                 if (template) {
-                    let props = {
+                    return cloneElement(template, {
                         ...this.props,
                         href: null
-                    };
+                    });
-                    return cloneElement(template, props);
                 }
             }
         }

elements/Ellipse.js

@@ -3,7 +3,7 @@ import React, {
     PropTypes
 } from 'react-native';
 import Shape, {ELLIPSE} from './Shape';
-import {ellipseProps, pathProps} from '../lib/props';
+import {ellipseProps, pathProps, fillProps, strokeProps} from '../lib/props';
 
 class Ellipse extends Shape{
     static displayName = 'Ellipse';
@@ -12,14 +12,9 @@ class Ellipse extends Shape{
         ...ellipseProps
     };
 
-    static defaultProps = {
-        cx: 0,
-        cy: 0,
-        rx: 0,
-        ry: 0
-    };
-
     static contextTypes = {
+        ...fillProps,
+        ...strokeProps,
         ...ellipseProps,
         isInGroup: PropTypes.bool
     };

elements/Line.js

@@ -3,7 +3,7 @@ import React, {
     PropTypes
 } from 'react-native';
 import Shape, {LINE} from './Shape';
-import {lineProps, pathProps} from '../lib/props';
+import {lineProps, pathProps, fillProps, strokeProps} from '../lib/props';
 
 class Line extends Shape{
     static displayName = 'Line';
@@ -12,14 +12,9 @@ class Line extends Shape{
         ...lineProps
     };
 
-    static defaultProps = {
-        x1: 0,
-        x2: 0,
-        y1: 0,
-        y2: 0
-    };
-
     static contextTypes = {
+        ...fillProps,
+        ...strokeProps,
         ...lineProps,
         isInGroup: PropTypes.bool
     };

elements/Rect.js

@@ -3,7 +3,7 @@ import React, {
     PropTypes
 } from 'react-native';
 import Shape, {RECT} from './Shape';
-import {rectProps, pathProps} from '../lib/props';
+import {rectProps, pathProps, fillProps, strokeProps} from '../lib/props';
 
 class Rect extends Shape{
     static displayName = 'Rect';
@@ -12,16 +12,9 @@ class Rect extends Shape{
         ...rectProps
     };
 
-    static defaultProps = {
-        x: 0,
-        y: 0,
-        width: 0,
-        height: 0,
-        rx: 0,
-        ry: 0
-    };
-
     static contextTypes = {
+        ...fillProps,
+        ...strokeProps,
         ...rectProps,
         isInGroup: PropTypes.bool
     };

elements/Shape.js

@@ -51,7 +51,7 @@ class Shape extends Component{
         let props = this.props;
 
         if (this.context.isInGroup) {
-            props = _.defaults(this.context, props, {
+            props = _.defaults({}, props, this.context, {
                 isInGroup: null
             });
         }
@@ -59,7 +59,6 @@ class Shape extends Component{
         let shape = new SerializableShape(props, COORD_PROPS[this.type]).toJSON();
 
         return <NativePath
-            {...props}
             {...extractProps(this.type === 3 ? {
                 ...props,
                 x: null,

elements/Svg.js

@@ -6,7 +6,6 @@ import React, {
     View,
     requireNativeComponent
 } from 'react-native';
-import extractViewbox from '../lib/extract/extractViewbox';
 import ViewBox from './ViewBox';
 import _ from 'lodash';
 

elements/Symbol.js

@@ -5,7 +5,6 @@ import React, {
 
 import ViewBox from './ViewBox';
 import Defs from './Defs';
-import extractViewbox from '../lib/extract/extractViewbox';
 class SymbolElement extends Component{
     static displayName = 'Symbol';
     static propType = {

ios/RNSVGShape.m

@@ -41,7 +41,7 @@
             CGFloat cy = [self getActualProp:@"cy" relative:height];
             CGFloat rx = [self getActualProp:@"rx" relative:height];
             CGFloat ry = [self getActualProp:@"ry" relative:height];
-            CGPathAddEllipseInRect(path, nil, CGRectMake(cx - rx / 2, cy - ry / 2, rx * 2, ry * 2));
+            CGPathAddEllipseInRect(path, nil, CGRectMake(cx - rx, cy - ry, rx * 2, ry * 2));
             break;
         }
         case 2:

lib/extract/extractViewbox.js

@@ -1,4 +1,4 @@
-export default function({viewbox, width, height, preserveAspectRatio, x: dx, y: dy, dScale, dScaleX, dScaleY, shouldTransform}) {
+export default function({viewbox, width, height, preserveAspectRatio, x: dx, y: dy, dScale, dScaleX, dScaleY}) {
     if (!viewbox || !width || !height) {
         return false;
     }
@@ -47,7 +47,7 @@ export default function({viewbox, width, height, preserveAspectRatio, x: dx, y:
             y = -vy * sy;
         }
 
-        if (shouldTransform) {
+        //if (shouldTransform) {
         x += (+dx || 0);
         y += (+dy || 0);
 
@@ -58,7 +58,7 @@ export default function({viewbox, width, height, preserveAspectRatio, x: dx, y:
             scaleX *= (+dScaleX || 1);
             scaleY *= (+dScaleY || 1);
         }
-        }
+        //}
 
         return {
             x,