victory-chart/lib/components/victory-group/victory-group.js

Chart Component for Victory

Object.defineProperty(exports,"__esModule",{value:true});var _defaults2=require("lodash/defaults");var _defaults3=_interopRequireDefault(_defaults2);var _assign2=require("lodash/assign");var _assign3=_interopRequireDefault(_assign2);var _createClass=function(){function defineProperties(target,props){for(var i=0;i<props.length;i++){var descriptor=props[i];descriptor.enumerable=descriptor.enumerable||false;descriptor.configurable=true;if("value"in descriptor)descriptor.writable=true;Object.defineProperty(target,descriptor.key,descriptor);}}return function(Constructor,protoProps,staticProps){if(protoProps)defineProperties(Constructor.prototype,protoProps);if(staticProps)defineProperties(Constructor,staticProps);return Constructor;};}();
var _react=require("react");var _react2=_interopRequireDefault(_react);
var _victoryCore=require("victory-core");


var _wrapper=require("../../helpers/wrapper");var _wrapper2=_interopRequireDefault(_wrapper);function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj};}function _toConsumableArray(arr){if(Array.isArray(arr)){for(var i=0,arr2=Array(arr.length);i<arr.length;i++){arr2[i]=arr[i];}return arr2;}else{return Array.from(arr);}}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 fallbackProps={
width:450,
height:300,
padding:50,
offset:0};var


VictoryGroup=function(_React$Component){_inherits(VictoryGroup,_React$Component);














































































































function VictoryGroup(props){_classCallCheck(this,VictoryGroup);var _this=_possibleConstructorReturn(this,(VictoryGroup.__proto__||Object.getPrototypeOf(VictoryGroup)).call(this,
props));
if(props.animate){
_this.state={
nodesShouldLoad:false,
nodesDoneLoad:false,
animating:true};

_this.setAnimationState=_wrapper2.default.setAnimationState.bind(_this);
}return _this;
}_createClass(VictoryGroup,[{key:"componentWillReceiveProps",value:function componentWillReceiveProps(

nextProps){
if(this.props.animate){
this.setAnimationState(this.props,nextProps);
}
}},{key:"getCalculatedProps",value:function getCalculatedProps(

props,childComponents,style){
var modifiedProps=_victoryCore.Helpers.modifyProps(props,fallbackProps);
var horizontal=modifiedProps.horizontal||childComponents.every(
function(component){return component.props.horizontal;});

var datasets=_wrapper2.default.getDataFromChildren(modifiedProps);
var domain={
x:_wrapper2.default.getDomain(modifiedProps,"x",childComponents),
y:_wrapper2.default.getDomain(modifiedProps,"y",childComponents)};

var range={
x:_victoryCore.Helpers.getRange(modifiedProps,"x"),
y:_victoryCore.Helpers.getRange(modifiedProps,"y")};

var baseScale={
x:_victoryCore.Scale.getScaleFromProps(modifiedProps,"x")||_victoryCore.Scale.getDefaultScale(),
y:_victoryCore.Scale.getScaleFromProps(modifiedProps,"y")||_victoryCore.Scale.getDefaultScale()};

var xScale=baseScale.x.domain(domain.x).range(range.x);
var yScale=baseScale.y.domain(domain.y).range(range.y);
var scale={
x:horizontal?yScale:xScale,
y:horizontal?xScale:yScale};

var categories={
x:_wrapper2.default.getCategories(modifiedProps,"x"),
y:_wrapper2.default.getCategories(modifiedProps,"y")};

var colorScale=modifiedProps.colorScale;
var color=modifiedProps.color;
return{datasets:datasets,categories:categories,range:range,domain:domain,horizontal:horizontal,scale:scale,style:style,colorScale:colorScale,color:color};
}},{key:"pixelsToValue",value:function pixelsToValue(

props,axis,calculatedProps){
if(props.offset===0){
return 0;
}
var childComponents=_react2.default.Children.toArray(props.children);
var horizontalChildren=childComponents.some(function(child){return child.props.horizontal;});
var horizontal=props&&props.horizontal||horizontalChildren.length>0;
var currentAxis=_victoryCore.Helpers.getCurrentAxis(axis,horizontal);
var domain=calculatedProps.domain[currentAxis];
var range=calculatedProps.range[currentAxis];
var domainExtent=Math.max.apply(Math,_toConsumableArray(domain))-Math.min.apply(Math,_toConsumableArray(domain));
var rangeExtent=Math.max.apply(Math,_toConsumableArray(range))-Math.min.apply(Math,_toConsumableArray(range));
return domainExtent/rangeExtent*props.offset;
}},{key:"getXO",value:function getXO(

props,calculatedProps,index){
var center=(calculatedProps.datasets.length-1)/2;
var totalWidth=this.pixelsToValue(props,"x",calculatedProps);
return(index-center)*totalWidth;
}},{key:"getLabels",value:function getLabels(

props,datasets,index){
if(!props.labels){
return undefined;
}
return Math.floor(datasets.length/2)===index?props.labels:undefined;
}},{key:"getChildProps",value:function getChildProps(

props,calculatedProps){var
categories=calculatedProps.categories,domain=calculatedProps.domain,scale=calculatedProps.scale,horizontal=calculatedProps.horizontal;
return{
height:props.height,
width:props.width,
padding:_victoryCore.Helpers.getPadding(props),
standalone:false,
theme:props.theme,
categories:categories,
domain:domain,
scale:scale,
horizontal:horizontal};

}},{key:"getColorScale",value:function getColorScale(

props,child){
var role=child.type&&child.type.role;
var colorScaleOptions=child.props.colorScale||props.colorScale;
if(role!=="group"&&role!=="stack"){
return undefined;
}
return props.theme&&props.theme.group?colorScaleOptions||props.theme.group.colorScale:
colorScaleOptions;
}},{key:"getDataWithOffset",value:function getDataWithOffset(

props,defaultDataset,offset){
var dataset=props.data||props.y?_victoryCore.Data.getData(props):defaultDataset;
var xOffset=offset||0;
return dataset.map(function(datum){
var x1=datum.x instanceof Date?new Date(datum.x+xOffset):datum.x+xOffset;
return(0,_assign3.default)({},datum,{x1:x1});
});
}},{key:"getNewChildren",value:function getNewChildren(


props,childComponents,calculatedProps){var
datasets=calculatedProps.datasets,horizontal=calculatedProps.horizontal;var
offset=props.offset,theme=props.theme,labelComponent=props.labelComponent;
var childProps=this.getChildProps(props,calculatedProps);
var getAnimationProps=_wrapper2.default.getAnimationProps.bind(this);
var newChildren=[];
for(var index=0,len=childComponents.length;index<len;index++){
var child=childComponents[index];
var role=child.type&&child.type.role;
var xOffset=this.getXO(props,calculatedProps,index);
var style=role==="voronoi"||role==="tooltip"?
child.props.style:_wrapper2.default.getChildStyle(child,index,calculatedProps);
var labels=props.labels?this.getLabels(props,datasets,index):child.props.labels;
var defaultDomainPadding=horizontal?
{y:offset*childComponents.length/2}:
{x:offset*childComponents.length/2};
var domainPadding=child.props.domainPadding||
props.domainPadding||defaultDomainPadding;
newChildren[index]=_react2.default.cloneElement(child,(0,_assign3.default)({
domainPadding:domainPadding,labels:labels,style:style,theme:theme,horizontal:horizontal,
data:this.getDataWithOffset(props,datasets[index],xOffset),
animate:getAnimationProps(props,child,index),
colorScale:this.getColorScale(props,child),
key:index,
labelComponent:labelComponent||child.props.labelComponent,
xOffset:role==="stack"?xOffset:undefined},
childProps));
}
return newChildren;
}},{key:"getContainer",value:function getContainer(

props,calculatedProps){var
width=props.width,height=props.height,containerComponent=props.containerComponent;var
scale=calculatedProps.scale,style=calculatedProps.style;
var parentProps=(0,_defaults3.default)(
{},
containerComponent.props,
{style:style.parent,scale:scale,width:width,height:height});

return _react2.default.cloneElement(containerComponent,parentProps);
}},{key:"renderGroup",value:function renderGroup(

children,style){
return _react2.default.cloneElement(
this.props.groupComponent,
{role:"presentation",style:style},
children);

}},{key:"render",value:function render()

{
var props=this.state&&this.state.nodesWillExit?
this.state.oldProps||this.props:this.props;
var modifiedProps=_victoryCore.Helpers.modifyProps(props,fallbackProps,"group");var
theme=modifiedProps.theme,standalone=modifiedProps.standalone,events=modifiedProps.events,eventKey=modifiedProps.eventKey;
var defaultStyle=theme&&theme.group&&theme.group.style?theme.group.style:{};
var style=_victoryCore.Helpers.getStyles(modifiedProps.style,defaultStyle,"auto","100%");
var childComponents=_react2.default.Children.toArray(modifiedProps.children);
var calculatedProps=this.getCalculatedProps(modifiedProps,childComponents,style,
fallbackProps.props);
var newChildren=this.getNewChildren(modifiedProps,childComponents,calculatedProps);
var group=this.renderGroup(newChildren,style.parent);
var container=standalone?
this.getContainer(modifiedProps,calculatedProps):group;
if(events){
return(
_react2.default.createElement(_victoryCore.VictorySharedEvents,{events:events,eventKey:eventKey,container:container},
newChildren));


}
return standalone?_react2.default.cloneElement(container,container.props,group):group;
}}]);return VictoryGroup;}(_react2.default.Component);VictoryGroup.displayName="VictoryGroup";VictoryGroup.role="group";VictoryGroup.propTypes={animate:_react.PropTypes.object,categories:_react.PropTypes.oneOfType([_react.PropTypes.arrayOf(_react.PropTypes.string),_react.PropTypes.shape({x:_react.PropTypes.arrayOf(_react.PropTypes.string),y:_react.PropTypes.arrayOf(_react.PropTypes.string)})]),children:_react2.default.PropTypes.oneOfType([_react2.default.PropTypes.arrayOf(_react2.default.PropTypes.node),_react2.default.PropTypes.node]),color:_react.PropTypes.string,colorScale:_react.PropTypes.oneOfType([_react.PropTypes.arrayOf(_react.PropTypes.string),_react.PropTypes.oneOf(["grayscale","qualitative","heatmap","warm","cool","red","green","blue"])]),containerComponent:_react.PropTypes.element,data:_react.PropTypes.array,domainPadding:_react.PropTypes.oneOfType([_react.PropTypes.shape({x:_react.PropTypes.oneOfType([_react.PropTypes.number,_victoryCore.PropTypes.domain]),y:_react.PropTypes.oneOfType([_react.PropTypes.number,_victoryCore.PropTypes.domain])}),_react.PropTypes.number]),dataComponent:_react.PropTypes.element,domain:_react.PropTypes.oneOfType([_victoryCore.PropTypes.domain,_react.PropTypes.shape({x:_victoryCore.PropTypes.domain,y:_victoryCore.PropTypes.domain})]),events:_react.PropTypes.arrayOf(_react.PropTypes.shape({childName:_react.PropTypes.oneOfType([_react.PropTypes.string,_react.PropTypes.array]),target:_react.PropTypes.oneOf(["data","labels","parent"]),eventKey:_react.PropTypes.oneOfType([_react.PropTypes.array,_react.PropTypes.func,_victoryCore.PropTypes.allOfType([_victoryCore.PropTypes.integer,_victoryCore.PropTypes.nonNegative]),_react.PropTypes.string]),eventHandlers:_react.PropTypes.object})),eventKey:_react.PropTypes.oneOfType([_react.PropTypes.func,_victoryCore.PropTypes.allOfType([_victoryCore.PropTypes.integer,_victoryCore.PropTypes.nonNegative]),_react.PropTypes.string]),groupComponent:_react.PropTypes.element,height:_victoryCore.PropTypes.nonNegative,horizontal:_react.PropTypes.bool,labels:_react.PropTypes.oneOfType([_react.PropTypes.func,_react.PropTypes.array]),labelComponent:_react.PropTypes.element,name:_react.PropTypes.string,offset:_react.PropTypes.number,padding:_react.PropTypes.oneOfType([_react.PropTypes.number,_react.PropTypes.shape({top:_react.PropTypes.number,bottom:_react.PropTypes.number,left:_react.PropTypes.number,right:_react.PropTypes.number})]),samples:_victoryCore.PropTypes.nonNegative,scale:_react.PropTypes.oneOfType([_victoryCore.PropTypes.scale,_react.PropTypes.shape({x:_victoryCore.PropTypes.scale,y:_victoryCore.PropTypes.scale})]),sharedEvents:_react.PropTypes.shape({events:_react.PropTypes.array,getEventState:_react.PropTypes.func}),standalone:_react.PropTypes.bool,style:_react.PropTypes.shape({parent:_react.PropTypes.object,data:_react.PropTypes.object,labels:_react.PropTypes.object}),theme:_react.PropTypes.object,width:_victoryCore.PropTypes.nonNegative,x:_react.PropTypes.oneOfType([_react.PropTypes.func,_victoryCore.PropTypes.allOfType([_victoryCore.PropTypes.integer,_victoryCore.PropTypes.nonNegative]),_react.PropTypes.string,_react.PropTypes.arrayOf(_react.PropTypes.string)]),y:_react.PropTypes.oneOfType([_react.PropTypes.func,_victoryCore.PropTypes.allOfType([_victoryCore.PropTypes.integer,_victoryCore.PropTypes.nonNegative]),_react.PropTypes.string,_react.PropTypes.arrayOf(_react.PropTypes.string)])};VictoryGroup.defaultProps={samples:50,scale:"linear",standalone:true,containerComponent:_react2.default.createElement(_victoryCore.VictoryContainer,null),groupComponent:_react2.default.createElement("g",null),theme:_victoryCore.VictoryTheme.grayscale};VictoryGroup.getDomain=_wrapper2.default.getDomain.bind(_wrapper2.default);VictoryGroup.getData=_wrapper2.default.getData.bind(_wrapper2.default);exports.default=VictoryGroup;