react-native-gifted-charts 1.2.2 → 1.2.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-gifted-charts",
-  "version": "1.2.2",
+  "version": "1.2.3",
   "description": "The most complete library for Bar, Line, Area, Pie, Donut and Stacked Bar charts in React Native. Allows 2D, 3D, gradient, animations and live data updates.",
   "main": "src/index.tsx",
   "files": [

package/src/BarChart/RenderBars.tsx

@@ -25,6 +25,7 @@ type Props = {
 
   item: itemType;
   index: number;
+  label: String;
   containerHeight?: number;
   maxValue: number;
   spacing?: number;
@@ -108,6 +109,8 @@ const RenderBars = (props: Props) => {
     opacity,
     animationDuration,
     autoShiftLabels,
+    label,
+    labelTextStyle,
   } = props;
 
   const barMarginBottom =
@@ -527,8 +530,8 @@ const RenderBars = (props: Props) => {
         />
       )}
       {isAnimated
-        ? renderAnimatedLabel(item.label || '', item.labelTextStyle, item.value)
-        : renderLabel(item.label || '', item.labelTextStyle, item.value)}
+        ? renderAnimatedLabel(label, labelTextStyle, item.value)
+        : renderLabel(label, labelTextStyle, item.value)}
     </TouchableOpacity>
   );
 };

package/src/BarChart/RenderStackBars.tsx

@@ -11,6 +11,7 @@ type Props = {
   topLabelComponent?: Component;
   topLabelContainerStyle?: Style;
   opacity?: number;
+  label: String;
   labelTextStyle?: any;
   disablePress?: boolean;
 
@@ -66,6 +67,8 @@ const RenderStackBars = (props: Props) => {
     spacing,
     rotateLabel,
     xAxisThickness,
+    label,
+    labelTextStyle,
   } = props;
   const disablePress = props.disablePress || false;
   const renderLabel = (label: String, labelTextStyle: any) => {
@@ -246,7 +249,7 @@ const RenderStackBars = (props: Props) => {
         />
       )}
       {static2DSimple(item)}
-      {renderLabel(item.label || '', item.labelTextStyle)}
+      {renderLabel(label || '', labelTextStyle)}
     </View>
   );
 };

package/src/BarChart/index.tsx

@@ -119,6 +119,8 @@ type PropTypes = {
   hideOrigin?: Boolean;
   labelWidth?: number;
   yAxisLabelTexts?: Array<string>;
+  xAxisLabelTexts?: Array<string>;
+  xAxisLabelTextStyle?: any;
   yAxisLabelPrefix?: String;
   yAxisLabelSuffix?: String;
   autoShiftLabels?: Boolean;
@@ -1385,6 +1387,15 @@ export const BarChart = (props: PropTypes) => {
                     barBorderRadius={props.barBorderRadius}
                     barBackgroundPattern={props.barBackgroundPattern}
                     patternId={props.patternId}
+                    label={
+                      item.label ||
+                      (props.xAxisLabelTexts && props.xAxisLabelTexts[index]
+                        ? props.xAxisLabelTexts[index]
+                        : '')
+                    }
+                    labelTextStyle={
+                      item.labelTextStyle || props.xAxisLabelTextStyle
+                    }
                   />
                 );
               })
@@ -1436,6 +1447,15 @@ export const BarChart = (props: PropTypes) => {
                   barBackgroundPattern={props.barBackgroundPattern}
                   patternId={props.patternId}
                   barMarginBottom={props.barMarginBottom}
+                  label={
+                    item.label ||
+                    (props.xAxisLabelTexts && props.xAxisLabelTexts[index]
+                      ? props.xAxisLabelTexts[index]
+                      : '')
+                  }
+                  labelTextStyle={
+                    item.labelTextStyle || props.xAxisLabelTextStyle
+                  }
                 />
               ))}
         </Fragment>

package/src/LineChart/index.tsx

@@ -247,6 +247,8 @@ type propTypes = {
   textShiftX?: number;
   textShiftY?: number;
   yAxisLabelTexts?: Array<string>;
+  xAxisLabelTexts?: Array<string>;
+  xAxisLabelTextStyle?: any;
   width?: number;
   yAxisLabelPrefix?: String;
   yAxisLabelSuffix?: String;
@@ -254,6 +256,7 @@ type propTypes = {
   scrollAnimation?: Boolean;
   noOfSectionsBelowXAxis?: number;
   labelsExtraHeight?: number;
+  adjustToWidth?: Boolean;
 };
 type referenceConfigType = {
   thickness: number;
@@ -422,7 +425,15 @@ export const LineChart = (props: propTypes) => {
     props.initialSpacing === 0 ? 0 : props.initialSpacing || 40;
   const thickness = props.thickness || 2;
 
-  const spacing = props.spacing === 0 ? 0 : props.spacing || 60;
+  const adjustToWidth = props.adjustToWidth || false;
+
+  const spacing =
+    props.spacing === 0
+      ? 0
+      : props.spacing ||
+        (adjustToWidth
+          ? ((props.width || 200) - initialSpacing) / data.length
+          : 60);
 
   const xAxisThickness = props.xAxisThickness || 1;
   const dataPointsHeight1 =
@@ -2941,14 +2952,20 @@ export const LineChart = (props: propTypes) => {
               {isAnimated
                 ? renderAnimatedLabel(
                     index,
-                    item.label,
-                    item.labelTextStyle,
+                    item.label ||
+                      (props.xAxisLabelTexts && props.xAxisLabelTexts[index]
+                        ? props.xAxisLabelTexts[index]
+                        : ''),
+                    item.labelTextStyle || props.xAxisLabelTextStyle,
                     item.labelComponent,
                   )
                 : renderLabel(
                     index,
-                    item.label,
-                    item.labelTextStyle,
+                    item.label ||
+                      (props.xAxisLabelTexts && props.xAxisLabelTexts[index]
+                        ? props.xAxisLabelTexts[index]
+                        : ''),
+                    item.labelTextStyle || props.xAxisLabelTextStyle,
                     item.labelComponent,
                   )}
               {/* {renderLabel(index, item.label, item.labelTextStyle)} */}