From ab64b2c49dfd4ca1fff74de0fee949e6a12f7fe3 Mon Sep 17 00:00:00 2001
From: Jesper Lekland <jesper.lekland@gmail.com>
Date: Sun, 18 Feb 2018 21:06:12 +0100
Subject: [PATCH] fix x-axis

---
 src/x-axis.js                            | 12 ++++--------
 storybook/stories/x-axis/scale-band.js   |  1 -
 storybook/stories/x-axis/scale-linear.js |  2 +-
 storybook/stories/x-axis/scale-time.js   |  2 +-
 4 files changed, 6 insertions(+), 11 deletions(-)

diff --git a/src/x-axis.js b/src/x-axis.js
index 0d503bbf..25c204fe 100644
--- a/src/x-axis.js
+++ b/src/x-axis.js
@@ -102,10 +102,12 @@ class XAxis extends PureComponent {
                             // causes rendering issues
                             width > 0 &&
                             ticks.map((value, index) => {
+                                console.log('x', x(value))
                                 return (
                                     <SVGText
                                       textAnchor={'middle'}
                                       originX={x(value)}
+                                      alignmentBaseline={'hanging'}
                                       {...svg}
                                       key={index}
                                       x={x(value)}
@@ -113,7 +115,8 @@ class XAxis extends PureComponent {
                                         {formatLabel(value, index)}
                                     </SVGText>
                                 )
-                            })}
+                            })
+                        }
                     </Svg>
                 </View>
             </View>
@@ -121,11 +124,6 @@ class XAxis extends PureComponent {
     }
 }
 
-XAxis.Type = {
-    LINE: 'line',
-    BAR: 'bar',
-}
-
 XAxis.propTypes = {
     data: PropTypes.array.isRequired,
     labelStyle: PropTypes.any,
@@ -142,9 +140,7 @@ XAxis.propTypes = {
 }
 
 XAxis.defaultProps = {
-    type: 'line',
     spacing: 0.05,
-    chartType: XAxis.Type.LINE,
     contentInset: {},
     svg: {},
     xAccessor: ({ index }) => index,
diff --git a/storybook/stories/x-axis/scale-band.js b/storybook/stories/x-axis/scale-band.js
index a9d1e7c5..91487e58 100644
--- a/storybook/stories/x-axis/scale-band.js
+++ b/storybook/stories/x-axis/scale-band.js
@@ -32,7 +32,6 @@ class XAxisExample extends React.PureComponent {
                     data={ data }
                     scale={scale.scaleBand}
                     formatLabel={ (value, index) => index }
-                    chartType={ XAxis.Type.BAR }
                     labelStyle={ { color: 'black' } }
                 />
             </View>
diff --git a/storybook/stories/x-axis/scale-linear.js b/storybook/stories/x-axis/scale-linear.js
index ed2a634d..e8f06fe4 100644
--- a/storybook/stories/x-axis/scale-linear.js
+++ b/storybook/stories/x-axis/scale-linear.js
@@ -22,7 +22,7 @@ class XAxisExample extends React.PureComponent {
                     data={ data }
                     formatLabel={ (value, index) => index }
                     contentInset={{ left: 10, right: 10 }}
-                    svg={{ fontSize: 10 }}
+                    svg={{ fontSize: 10, fill: 'black' }}
                 />
             </View>
         )
diff --git a/storybook/stories/x-axis/scale-time.js b/storybook/stories/x-axis/scale-time.js
index 6e2225aa..62753bb2 100644
--- a/storybook/stories/x-axis/scale-time.js
+++ b/storybook/stories/x-axis/scale-time.js
@@ -51,12 +51,12 @@ class XAxisScaleTimeExample extends React.PureComponent {
                 <XAxis
                   data={data}
                   svg={{
-                      translate: '30',
                       fill: 'black',
                       fontSize: 8,
                       fontWeight: 'bold',
                       rotation: 20,
                       originY: 30,
+                      y: 5,
                   }}
                   xAccessor={({ item }) => item.date}
                   scale={scale.scaleTime}