gifted-charts-core 0.1.1 → 0.1.3

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "gifted-charts-core",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "Mathematical and logical utilities used by react-gifted-charts and react-native-gifted-charts",
   "main": "./src/index.js",
   "files": [

package/src/LineChart/index.d.ts

@@ -306,7 +306,7 @@ export declare const useLineChart: (props: extendedLineChartPropsType) => {
     addLeadingAndTrailingPathForAreaFill: (initialPath: string, value: number, dataLength: number) => string;
     getNextPoint: (data: lineDataItem[], index: number, around: boolean, before: boolean) => string;
     getStepPath: (data: lineDataItem[], i: number) => string;
-    getSegmentPath: (data: lineDataItem[], i: number, lineSegment: LineSegment[] | undefined, startIndex: number, endIndex: number) => string;
+    getSegmentPath: (data: lineDataItem[], i: number, lineSegment: LineSegment[] | undefined, startIndex: number, endIndex: number, isSecondary?: boolean) => string;
     gradientDirection: string;
     horizSections: {
         value: string;

package/src/LineChart/index.js

@@ -414,11 +414,11 @@ export var useLineChart = function (props) {
             getY(data[i].value) +
             getNextPoint(data, i, around, before));
     };
-    var getSegmentPath = function (data, i, lineSegment, startIndex, endIndex) {
+    var getSegmentPath = function (data, i, lineSegment, startIndex, endIndex, isSecondary) {
         var path = 'L' +
             getX(i) +
             ' ' +
-            getY(data[i].value) +
+            (isSecondary ? getSecondaryY(data[i].value) : getY(data[i].value)) +
             ' ' +
             getSegmentString(lineSegment, i, SEGMENT_START, SEGMENT_END);
         if (highlightedRange) {
@@ -439,7 +439,12 @@ export var useLineChart = function (props) {
                     for (var i = 0; i < set.data.length; i++) {
                         if (i >= ((_b = set.startIndex) !== null && _b !== void 0 ? _b : 0) &&
                             i <= ((_c = set.endIndex) !== null && _c !== void 0 ? _c : set.data.length - 1)) {
-                            pArray.push([getX(i), getY(set.data[i].value)]);
+                            pArray.push([
+                                getX(i),
+                                set.isSecondary
+                                    ? getSecondaryY(set.data[i].value)
+                                    : getY(set.data[i].value)
+                            ]);
                         }
                     }
                     var xx = svgPath(pArray, (_d = set.curveType) !== null && _d !== void 0 ? _d : curveType, (_e = set.curvature) !== null && _e !== void 0 ? _e : curvature);
@@ -468,7 +473,7 @@ export var useLineChart = function (props) {
                                 pp += getStepPath(set.data, i);
                             }
                             else {
-                                pp += getSegmentPath(set.data, i, set.lineSegments, (_l = set.startIndex) !== null && _l !== void 0 ? _l : 0, (_m = set.endIndex) !== null && _m !== void 0 ? _m : set.data.length - 1);
+                                pp += getSegmentPath(set.data, i, set.lineSegments, (_l = set.startIndex) !== null && _l !== void 0 ? _l : 0, (_m = set.endIndex) !== null && _m !== void 0 ? _m : set.data.length - 1, set.isSecondary);
                             }
                         }
                     }

package/src/LineChart/index.ts

@@ -727,13 +727,14 @@ export const useLineChart = (props: extendedLineChartPropsType) => {
     i: number,
     lineSegment: LineSegment[] | undefined,
     startIndex: number,
-    endIndex: number
+    endIndex: number,
+    isSecondary?: boolean
   ): string => {
     let path =
       'L' +
       getX(i) +
       ' ' +
-      getY(data[i].value) +
+      (isSecondary ? getSecondaryY(data[i].value) : getY(data[i].value)) +
       ' ' +
       getSegmentString(lineSegment, i, SEGMENT_START, SEGMENT_END)
 
@@ -764,7 +765,12 @@ export const useLineChart = (props: extendedLineChartPropsType) => {
               i >= (set.startIndex ?? 0) &&
               i <= (set.endIndex ?? set.data.length - 1)
             ) {
-              pArray.push([getX(i), getY(set.data[i].value)])
+              pArray.push([
+                getX(i),
+                set.isSecondary
+                  ? getSecondaryY(set.data[i].value)
+                  : getY(set.data[i].value)
+              ])
             }
           }
           let xx = svgPath(
@@ -825,7 +831,8 @@ export const useLineChart = (props: extendedLineChartPropsType) => {
                   i,
                   set.lineSegments,
                   set.startIndex ?? 0,
-                  set.endIndex ?? set.data.length - 1
+                  set.endIndex ?? set.data.length - 1,
+                  set.isSecondary
                 )
               }
             }

package/src/PieChart/pro.d.ts

@@ -1,10 +1,16 @@
 import { PieChartPropsType, pieDataItem } from './types';
 import { LabelsPosition } from '../utils/types';
+interface IsvgProps {
+    height: number;
+    width: number;
+    viewBox: string;
+}
 interface IusePiePro {
     radius: number;
     total: number;
     donut?: boolean;
     strokeWidth: number;
+    maxStrokeWidth: number;
     isAnimated?: boolean;
     animationDuration: number;
     initial: string;
@@ -17,6 +23,9 @@ interface IusePiePro {
         y: number;
     };
     labelsPosition: LabelsPosition;
+    heightFactor: number;
+    height: number;
+    svgProps: IsvgProps;
 }
 export declare const usePiePro: (props: PieChartPropsType) => IusePiePro;
 export {};

package/src/PieChart/pro.js

@@ -1,10 +1,43 @@
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
+    if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
+        if (ar || !(i in from)) {
+            if (!ar) ar = Array.prototype.slice.call(from, 0, i);
+            ar[i] = from[i];
+        }
+    }
+    return to.concat(ar || Array.prototype.slice.call(from));
+};
 import { defaultAnimationDuration } from '../utils/constants';
 export var usePiePro = function (props) {
     var _a, _b;
-    var data = props.data, isAnimated = props.isAnimated, donut = props.donut, semiCircle = props.semiCircle, _c = props.radius, radius = _c === void 0 ? 120 : _c, _d = props.innerRadius, innerRadius = _d === void 0 ? donut ? radius / 2.5 : 0 : _d, _e = props.strokeWidth, strokeWidth = _e === void 0 ? 0 : _e, _f = props.edgesRadius, edgesRadius = _f === void 0 ? 0 : _f, _g = props.startAngle, startAngle = _g === void 0 ? 0 : _g;
+    var data = props.data, isAnimated = props.isAnimated, donut = props.donut, semiCircle = props.semiCircle, _c = props.radius, radius = _c === void 0 ? 120 : _c, _d = props.innerRadius, innerRadius = _d === void 0 ? donut ? radius / 2.5 : 0 : _d, _e = props.strokeWidth, strokeWidth = _e === void 0 ? 0 : _e, _f = props.edgesRadius, edgesRadius = _f === void 0 ? 0 : _f, _g = props.startAngle, startAngle = _g === void 0 ? 0 : _g, ring = props.ring;
     var endAngle = (_a = props.endAngle) !== null && _a !== void 0 ? _a : startAngle + Math.PI * (semiCircle ? 1 : 2);
     var total = data.reduce(function (acc, item) { return acc + (item === null || item === void 0 ? void 0 : item.value); }, 0);
     var animationDuration = (_b = props.animationDuration) !== null && _b !== void 0 ? _b : defaultAnimationDuration;
+    var maxStrokeWidth = Math.max.apply(Math, __spreadArray(__spreadArray([], __read(data.map(function (item) { var _a; return (_a = item.strokeWidth) !== null && _a !== void 0 ? _a : 0; })), false), [strokeWidth], false));
+    var heightFactor = semiCircle ? 1 : 2;
+    var height = radius + maxStrokeWidth;
+    var svgProps = {
+        height: height * 2,
+        width: height * 2,
+        viewBox: "".concat(-maxStrokeWidth * 1.5, " ").concat(-maxStrokeWidth - (semiCircle ? height / 2 : 0), " ").concat(height * 2, " ").concat(height * 2)
+    };
     //   let endAngleLocal = 0
     var addValues = function (index) {
         var _a;
@@ -80,7 +113,9 @@ export var usePiePro = function (props) {
             var _a = getCoordinates(0, (radius - innerRadius) / (radius / 20)), startInnerX = _a.startInnerX, startInnerY = _a.startInnerY, startOuterX = _a.startOuterX, startOuterY = _a.startOuterY;
             return "M".concat(startInnerX, ",").concat(startInnerY, " L").concat(startOuterX, ",").concat(startOuterY, " ");
         }
-        return "M".concat(radius + innerRadius, ",").concat(radius, " h").concat(radius - innerRadius, " ");
+        return ring
+            ? "M".concat(radius * 2, ",").concat(radius)
+            : "M".concat(radius + innerRadius, ",").concat(radius, " h").concat(radius - innerRadius, " ");
     };
     var getPath = function (index, totalParam) {
         var _a, _b;
@@ -91,8 +126,13 @@ export var usePiePro = function (props) {
                 ? 1
                 : 0;
         var arc = "A".concat(radius + ((_b = props.strokeWidth) !== null && _b !== void 0 ? _b : 0) / 2, ",").concat(radius, " 0 ").concat(isLargeArc, " 0 ");
-        var path = "".concat(arc, " ").concat(endOuterX, ", ").concat(endOuterY, "\n      L").concat(radius, ",").concat(radius, " ");
-        initial = "M".concat(radius, ",").concat(radius, " L").concat(endOuterX, ",").concat(endOuterY);
+        var path = "".concat(arc, " ").concat(endOuterX, ", ").concat(endOuterY, " ");
+        if (!ring) {
+            path += "L".concat(radius, ",").concat(radius, " ");
+        }
+        initial = ring
+            ? "M".concat(endOuterX, ",").concat(endOuterY, " ")
+            : "M".concat(radius, ",").concat(radius, " L").concat(endOuterX, ",").concat(endOuterY);
         return path;
     };
     var getDonutPath = function (index, item, totalParam) {
@@ -153,6 +193,7 @@ export var usePiePro = function (props) {
         total: total,
         donut: donut,
         strokeWidth: strokeWidth,
+        maxStrokeWidth: maxStrokeWidth,
         isAnimated: isAnimated,
         animationDuration: animationDuration,
         initial: initial,
@@ -161,6 +202,9 @@ export var usePiePro = function (props) {
         getStartCaps: getStartCaps,
         getEndCaps: getEndCaps,
         getTextCoordinates: getTextCoordinates,
-        labelsPosition: labelsPosition
+        labelsPosition: labelsPosition,
+        heightFactor: heightFactor,
+        height: height,
+        svgProps: svgProps
     };
 };

package/src/PieChart/pro.ts

@@ -2,11 +2,18 @@ import { defaultAnimationDuration } from '../utils/constants'
 import { PieChartPropsType, pieDataItem } from './types'
 import { LabelsPosition } from '../utils/types'
 
+interface IsvgProps {
+  height: number
+  width: number
+  viewBox: string
+}
+
 interface IusePiePro {
   radius: number
   total: number
   donut?: boolean
   strokeWidth: number
+  maxStrokeWidth: number
   isAnimated?: boolean
   animationDuration: number
   initial: string
@@ -19,6 +26,9 @@ interface IusePiePro {
     labelPos?: LabelsPosition
   ) => { x: number; y: number }
   labelsPosition: LabelsPosition
+  heightFactor: number
+  height: number
+  svgProps: IsvgProps
 }
 
 export const usePiePro = (props: PieChartPropsType): IusePiePro => {
@@ -31,12 +41,29 @@ export const usePiePro = (props: PieChartPropsType): IusePiePro => {
     innerRadius = donut ? radius / 2.5 : 0,
     strokeWidth = 0,
     edgesRadius = 0,
-    startAngle = 0
+    startAngle = 0,
+    ring
   } = props
   let endAngle = props.endAngle ?? startAngle + Math.PI * (semiCircle ? 1 : 2)
   const total = data.reduce((acc, item) => acc + item?.value, 0)
   const animationDuration = props.animationDuration ?? defaultAnimationDuration
 
+  const maxStrokeWidth = Math.max(
+    ...data.map((item) => item.strokeWidth ?? 0),
+    strokeWidth
+  )
+
+  const heightFactor = semiCircle ? 1 : 2
+  const height = radius + maxStrokeWidth
+
+  const svgProps = {
+    height: height * 2,
+    width: height * 2,
+    viewBox: `${-maxStrokeWidth * 1.5} ${
+      -maxStrokeWidth - (semiCircle ? height / 2 : 0)
+    } ${height * 2} ${height * 2}`
+  }
+
   //   let endAngleLocal = 0
 
   const addValues = (index: number) => {
@@ -130,7 +157,9 @@ export const usePiePro = (props: PieChartPropsType): IusePiePro => {
 
       return `M${startInnerX},${startInnerY} L${startOuterX},${startOuterY} `
     }
-    return `M${radius + innerRadius},${radius} h${radius - innerRadius} `
+    return ring
+      ? `M${radius * 2},${radius}`
+      : `M${radius + innerRadius},${radius} h${radius - innerRadius} `
   }
   const getPath = (index: number, totalParam?: number) => {
     const { endOuterX, endOuterY } = getCoordinates(
@@ -150,10 +179,15 @@ export const usePiePro = (props: PieChartPropsType): IusePiePro => {
     const arc = `A${
       radius + (props.strokeWidth ?? 0) / 2
     },${radius} 0 ${isLargeArc} 0 `
-    const path = `${arc} ${endOuterX}, ${endOuterY}
-      L${radius},${radius} `
+    let path = `${arc} ${endOuterX}, ${endOuterY} `
+
+    if (!ring) {
+      path += `L${radius},${radius} `
+    }
 
-    initial = `M${radius},${radius} L${endOuterX},${endOuterY}`
+    initial = ring
+      ? `M${endOuterX},${endOuterY} `
+      : `M${radius},${radius} L${endOuterX},${endOuterY}`
 
     return path
   }
@@ -258,6 +292,7 @@ export const usePiePro = (props: PieChartPropsType): IusePiePro => {
     total,
     donut,
     strokeWidth,
+    maxStrokeWidth,
     isAnimated,
     animationDuration,
     initial,
@@ -266,6 +301,9 @@ export const usePiePro = (props: PieChartPropsType): IusePiePro => {
     getStartCaps,
     getEndCaps,
     getTextCoordinates,
-    labelsPosition
+    labelsPosition,
+    heightFactor,
+    height,
+    svgProps
   }
 }

package/src/PieChart/types.d.ts

@@ -5,6 +5,7 @@ export interface PieChartPropsType {
     radius?: number;
     isThreeD?: boolean;
     donut?: boolean;
+    ring?: boolean;
     innerRadius?: number;
     shadow?: boolean;
     innerCircleColor?: ColorValue;
@@ -16,6 +17,7 @@ export interface PieChartPropsType {
     shadowWidth?: number;
     strokeWidth?: number;
     strokeColor?: string;
+    strokeDashArray?: number[];
     backgroundColor?: string;
     data: pieDataItem[];
     semiCircle?: boolean;
@@ -79,6 +81,7 @@ export interface pieDataItem {
     onPress?: Function;
     onLabelPress?: Function;
     strokeWidth?: number;
+    strokeDashArray?: number[];
     strokeColor?: string;
     focused?: boolean;
     peripheral?: boolean;

package/src/PieChart/types.ts

@@ -6,6 +6,7 @@ export interface PieChartPropsType {
   radius?: number
   isThreeD?: boolean
   donut?: boolean
+  ring?: boolean
   innerRadius?: number
   shadow?: boolean
   innerCircleColor?: ColorValue
@@ -17,6 +18,7 @@ export interface PieChartPropsType {
   shadowWidth?: number
   strokeWidth?: number
   strokeColor?: string
+  strokeDashArray?: number[]
   backgroundColor?: string
   data: pieDataItem[]
   semiCircle?: boolean
@@ -82,6 +84,7 @@ export interface pieDataItem {
   onPress?: Function
   onLabelPress?: Function
   strokeWidth?: number
+  strokeDashArray?: number[]
   strokeColor?: string
   focused?: boolean
   peripheral?: boolean

package/src/utils/types.d.ts

@@ -334,5 +334,6 @@ export interface DataSet {
     curvature?: number;
     curveType?: CurveType;
     lineSegments?: LineSegment[];
+    isSecondary?: boolean;
 }
 export {};

package/src/utils/types.ts

@@ -371,4 +371,5 @@ export interface DataSet {
   curvature?: number
   curveType?: CurveType
   lineSegments?: LineSegment[]
+  isSecondary?: boolean
 }