Added separate colors for BarChart

dist/BarChart.js

@@ -14,7 +14,7 @@ justifyContent:'space-around'}});var
 
 
 BarChart=function(_Component){_inherits(BarChart,_Component);
-function BarChart(props){_classCallCheck(this,BarChart);var _this=_possibleConstructorReturn(this,Object.getPrototypeOf(BarChart).call(this,
+function BarChart(props){_classCallCheck(this,BarChart);var _this=_possibleConstructorReturn(this,(BarChart.__proto__||Object.getPrototypeOf(BarChart)).call(this,
 props));_this.
 
 
@@ -27,7 +27,7 @@ _this.props.data.onDataPointPress(e,dataPoint,index);
 
 _drawBar=function(_dataPoint,index){var _dataPoint2=_slicedToArray(
 _dataPoint,2);var _x=_dataPoint2[0];var dataPoint=_dataPoint2[1];
-var backgroundColor=_this.props.color||C.BLUE;
+var backgroundColor=typeof _this.props.barColors!=='undefined'&&_this.props.barColors[index]?_this.props.barColors[index]:C.BLUE;
 var HEIGHT=_this.props.height;
 var WIDTH=_this.props.width;
 var widthPercent=_this.props.widthPercent||0.5;

dist/Chart.js

@@ -56,7 +56,7 @@ Chart=function(_Component){_inherits(Chart,_Component);
 
 
 
-function Chart(props){_classCallCheck(this,Chart);var _this=_possibleConstructorReturn(this,Object.getPrototypeOf(Chart).call(this,
+function Chart(props){_classCallCheck(this,Chart);var _this=_possibleConstructorReturn(this,(Chart.__proto__||Object.getPrototypeOf(Chart)).call(this,
 props));_this.
 
 
@@ -132,8 +132,8 @@ props));_this.
 
 
 _onContainerLayout=function(e){return _this.setState({
-containerHeight:Math.ceil(e.nativeEvent.layout.height)+1,
-containerWidth:Math.ceil(e.nativeEvent.layout.width)});};_this.state={bounds:{min:0,max:0}};return _this;}_createClass(Chart,[{key:'componentDidMount',value:function componentDidMount(){this._computeBounds();}},{key:'shouldComponentUpdate',value:function shouldComponentUpdate(props,state){return props!==this.props||state!==this.state;}},{key:'componentDidUpdate',value:function componentDidUpdate(props){if(this.props!==props){this._computeBounds();}}},{key:'_computeBounds',value:function _computeBounds(){var min=Infinity;var max=-Infinity;var data=this.props.data||[];data.forEach(function(XYPair){var number=XYPair[1];if(number<min)min=number;if(number>max)max=number;});min=Math.floor(min);max=Math.ceil(max);// Exit if we want tight bounds
+containerHeight:e.nativeEvent.layout.height,
+containerWidth:e.nativeEvent.layout.width});};_this.state={bounds:{min:0,max:0}};return _this;}_createClass(Chart,[{key:'componentDidMount',value:function componentDidMount(){this._computeBounds();}},{key:'shouldComponentUpdate',value:function shouldComponentUpdate(props,state){return props!==this.props||state!==this.state;}},{key:'componentDidUpdate',value:function componentDidUpdate(props){if(this.props!==props){this._computeBounds();}}},{key:'_computeBounds',value:function _computeBounds(){var min=Infinity;var max=-Infinity;var data=this.props.data||[];data.forEach(function(XYPair){var number=XYPair[1];if(number<min)min=number;if(number>max)max=number;});min=Math.floor(min);max=Math.ceil(max);// Exit if we want tight bounds
 if(this.props.tightBounds){return this.setState({bounds:{min:min,max:max}});}max=getRoundNumber(max,this.props.verticalGridStep);if(min<0){var step=void 0;if(this.props.verticalGridStep>3){step=Math.abs(max-min)/(this.props.verticalGridStep-1);}else{step=Math.max(Math.abs(max-min)/2,Math.max(Math.abs(min),Math.abs(max)));}step=getRoundNumber(step,this.props.verticalGridStep);var newMin=void 0;var newMax=void 0;if(Math.abs(min)>Math.abs(max)){var m=Math.ceil(Math.abs(min)/step);newMin=step*m*(min>0?1:-1);newMax=step*(this.props.verticalGridStep-m)*(max>0?1:-1);}else{var _m=Math.ceil(Math.abs(max)/step);newMax=step*_m*(max>0?1:-1);newMin=step*(this.props.verticalGridStep-_m)*(min>0?1:-1);}if(min<newMin){newMin-=step;newMax-=step;}if(max>newMax+step){newMin+=step;newMax+=step;}if(max<min){var tmp=max;max=min;min=tmp;}}return this.setState({bounds:{max:max,min:min}});}},{key:'_minVerticalBound',value:function _minVerticalBound()
 
 {

dist/Circle.js

@@ -4,7 +4,7 @@ var _reactNative=require('react-native');
 
 var _constants=require('./constants');var C=_interopRequireWildcard(_constants);function _interopRequireWildcard(obj){if(obj&&obj.__esModule){return obj;}else{var newObj={};if(obj!=null){for(var key in obj){if(Object.prototype.hasOwnProperty.call(obj,key))newObj[key]=obj[key];}}newObj.default=obj;return newObj;}}function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj};}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _possibleConstructorReturn(self,call){if(!self){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return call&&(typeof call==="object"||typeof call==="function")?call:self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:false,writable:true,configurable:true}});if(superClass)Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass;}var Path=_reactNative.ART.Path;var Shape=_reactNative.ART.Shape;var
 
-Circle=function(_Component){_inherits(Circle,_Component);function Circle(){_classCallCheck(this,Circle);return _possibleConstructorReturn(this,Object.getPrototypeOf(Circle).apply(this,arguments));}_createClass(Circle,[{key:'render',value:function render()
+Circle=function(_Component){_inherits(Circle,_Component);function Circle(){_classCallCheck(this,Circle);return _possibleConstructorReturn(this,(Circle.__proto__||Object.getPrototypeOf(Circle)).apply(this,arguments));}_createClass(Circle,[{key:'render',value:function render()
 
 
 

dist/Grid.js

@@ -2,7 +2,7 @@ Object.defineProperty(exports,"__esModule",{value:true});var _createClass=functi
 var _reactNative=require('react-native');
 var _util=require('./util');function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj};}function _classCallCheck(instance,Constructor){if(!(instance instanceof Constructor)){throw new TypeError("Cannot call a class as a function");}}function _possibleConstructorReturn(self,call){if(!self){throw new ReferenceError("this hasn't been initialised - super() hasn't been called");}return call&&(typeof call==="object"||typeof call==="function")?call:self;}function _inherits(subClass,superClass){if(typeof superClass!=="function"&&superClass!==null){throw new TypeError("Super expression must either be null or a function, not "+typeof superClass);}subClass.prototype=Object.create(superClass&&superClass.prototype,{constructor:{value:subClass,enumerable:false,writable:true,configurable:true}});if(superClass)Object.setPrototypeOf?Object.setPrototypeOf(subClass,superClass):subClass.__proto__=superClass;}var
 
-Grid=function(_Component){_inherits(Grid,_Component);function Grid(){_classCallCheck(this,Grid);return _possibleConstructorReturn(this,Object.getPrototypeOf(Grid).apply(this,arguments));}_createClass(Grid,[{key:'render',value:function render()
+Grid=function(_Component){_inherits(Grid,_Component);function Grid(){_classCallCheck(this,Grid);return _possibleConstructorReturn(this,(Grid.__proto__||Object.getPrototypeOf(Grid)).apply(this,arguments));}_createClass(Grid,[{key:'render',value:function render()
 
 
 
@@ -49,7 +49,7 @@ borderTopWidth:intendedLineWidth};
 
 var verticalGridStyle={
 height:this.props.height+1,
-width:this.props.width/data.length*stepsBetweenVerticalLines,
+width:this.props.width/(data.length-1)*stepsBetweenVerticalLines,
 borderRightColor:this.props.gridColor,
 borderRightWidth:intendedLineWidth};
 
@@ -74,4 +74,4 @@ verticalRange.map(function(_,i){return _react2.default.createElement(_reactNativ
 }()));
 
 
-}}]);return Grid;}(_react.Component);Grid.propTypes={showGrid:_react.PropTypes.bool,data:_react.PropTypes.array.isRequired,verticalGridStep:_react.PropTypes.number.isRequired,horizontalGridStep:_react.PropTypes.number,gridLineWidth:_react.PropTypes.number,gridColor:_react.PropTypes.oneOfType([_react.PropTypes.number,_react.PropTypes.string]),hideHorizontalGridLines:_react.PropTypes.bool,hideVerticalGridLines:_react.PropTypes.bool,height:_react.PropTypes.number.isRequired,width:_react.PropTypes.number.isRequired,type:_react.PropTypes.oneOf(['line','bar','pie']).isRequired};Grid.defaultProps={};exports.default=Grid;
+}}]);return Grid;}(_react.Component);Grid.propTypes={showGrid:_react.PropTypes.bool,data:_react.PropTypes.array.isRequired,verticalGridStep:_react.PropTypes.number.isRequired,horizontalGridStep:_react.PropTypes.number,gridLineWidth:_react.PropTypes.number,gridColor:_react.PropTypes.oneOfType([_react.PropTypes.number,_react.PropTypes.string]),hideHorizontalGridLines:_react.PropTypes.bool,hideVerticalGridLines:_react.PropTypes.bool,height:_react.PropTypes.number,width:_react.PropTypes.number,type:_react.PropTypes.oneOf(['line','bar','pie']).isRequired};Grid.defaultProps={};exports.default=Grid;

dist/LineChart.js

@@ -19,7 +19,7 @@ var heightZero=_reactNative.Platform.OS==='ios'?0:1;var
 
 LineChart=function(_Component){_inherits(LineChart,_Component);
 
-function LineChart(props){_classCallCheck(this,LineChart);var _this=_possibleConstructorReturn(this,Object.getPrototypeOf(LineChart).call(this,
+function LineChart(props){_classCallCheck(this,LineChart);var _this=_possibleConstructorReturn(this,(LineChart.__proto__||Object.getPrototypeOf(LineChart)).call(this,
 props));_this.
 
 
@@ -55,7 +55,7 @@ maxBound+=_this.props.verticalGridStep;
 
 var divisor=calculateDivisor(minBound,maxBound);
 var scale=(containerHeight+1)/divisor;
-var horizontalStep=containerWidth/data.length;
+var horizontalStep=containerWidth/(data.length-1);
 var dataPoints=[];
 var firstDataPoint=data[0][1];
 var height=minBound*scale+(containerHeight-firstDataPoint*scale);
@@ -95,10 +95,9 @@ _react2.default.createElement(_reactNative.View,{style:{position:'absolute'}},
 _react2.default.createElement(Surface,{width:containerWidth,height:containerHeight})),
 
 function(){
-if(!_this.props.showDataPoint)return null;
 return(
 _react2.default.createElement(Surface,{width:containerWidth,height:containerHeight},
-dataPoints.map(function(d,i){return _react2.default.createElement(_Circle2.default,_extends({key:i},d));})));
+_this.props.showDataPoint&&dataPoints.map(function(d,i){return _react2.default.createElement(_Circle2.default,_extends({key:i},d));})));
 
 
 }()));

dist/PieChart.js

@@ -8,7 +8,7 @@ var _Wedge=require('./Wedge');var _Wedge2=_interopRequireDefault(_Wedge);functio
 var getColor=function getColor(colors,index){return colors[index]||colors[colors.length%index];};var
 
 PieChart=function(_Component){_inherits(PieChart,_Component);
-function PieChart(props){_classCallCheck(this,PieChart);var _this=_possibleConstructorReturn(this,Object.getPrototypeOf(PieChart).call(this,
+function PieChart(props){_classCallCheck(this,PieChart);var _this=_possibleConstructorReturn(this,(PieChart.__proto__||Object.getPrototypeOf(PieChart)).call(this,
 props));_this.
 
 

dist/Wedge.js

@@ -50,7 +50,7 @@ var _reactNative=require('react-native');function _interopRequireDefault(obj){re
  */var Shape=_reactNative.ART.Shape;var Path=_reactNative.ART.Path;/**
  * Wedge is a React component for drawing circles, wedges and arcs.	Like other
  * ReactART components, it must be used in a <Surface>.
- */var Wedge=function(_Component){_inherits(Wedge,_Component);function Wedge(props){_classCallCheck(this,Wedge);var _this=_possibleConstructorReturn(this,Object.getPrototypeOf(Wedge).call(this,props));_this.circleRadians=Math.PI*2;_this.radiansPerDegree=Math.PI/180;_this._degreesToRadians=_this._degreesToRadians.bind(_this);return _this;}/**
+ */var Wedge=function(_Component){_inherits(Wedge,_Component);function Wedge(props){_classCallCheck(this,Wedge);var _this=_possibleConstructorReturn(this,(Wedge.__proto__||Object.getPrototypeOf(Wedge)).call(this,props));_this.circleRadians=Math.PI*2;_this.radiansPerDegree=Math.PI/180;_this._degreesToRadians=_this._degreesToRadians.bind(_this);return _this;}/**
 	 * _degreesToRadians(degrees)
 	 *
 	 * Helper function to convert degrees to radians

dist/xAxis.js

@@ -16,7 +16,7 @@ backgroundColor:'transparent'}});var
 
 
 
-XAxis=function(_Component){_inherits(XAxis,_Component);function XAxis(){_classCallCheck(this,XAxis);return _possibleConstructorReturn(this,Object.getPrototypeOf(XAxis).apply(this,arguments));}_createClass(XAxis,[{key:'render',value:function render()
+XAxis=function(_Component){_inherits(XAxis,_Component);function XAxis(){_classCallCheck(this,XAxis);return _possibleConstructorReturn(this,(XAxis.__proto__||Object.getPrototypeOf(XAxis)).apply(this,arguments));}_createClass(XAxis,[{key:'render',value:function render()
 
 
 

dist/yAxis.js

@@ -31,7 +31,7 @@ YAxis=function(_Component){_inherits(YAxis,_Component);
 
 
 
-function YAxis(props){_classCallCheck(this,YAxis);var _this=_possibleConstructorReturn(this,Object.getPrototypeOf(YAxis).call(this,
+function YAxis(props){_classCallCheck(this,YAxis);var _this=_possibleConstructorReturn(this,(YAxis.__proto__||Object.getPrototypeOf(YAxis)).call(this,
 props));_this.
 
 

react-native-chart.flow.js

@@ -25,7 +25,7 @@ declare type Chart = {
 	yAxisUseDecimal?: boolean,
 
 	// Bar chart props
-	color?: number | string,
+	barColors?: Array<number | string>,
 	cornerRadius?: number,
 	widthPercent?: number,
 

src/BarChart.js

@@ -27,7 +27,7 @@ export default class BarChart extends Component<void, any, any> {
 
 	_drawBar = (_dataPoint : [number, number], index : number) => {
 		const [_x, dataPoint] = _dataPoint;
-		const backgroundColor = this.props.color || C.BLUE;
+		const backgroundColor = (typeof this.props.barColors !== 'undefined' && this.props.barColors[index] ? this.props.barColors[index] : C.BLUE);
 		const HEIGHT = this.props.height;
 		const WIDTH = this.props.width;
 		let widthPercent = this.props.widthPercent || 0.5;