gifted-charts-core 0.1.51 → 0.1.53

package/README.md

@@ -1,4 +1,4 @@
 This library contains the common code used by [react-native-gifted-charts](https://www.npmjs.com/package/react-native-gifted-charts) and [react-gifted-charts](https://www.npmjs.com/package/react-gifted-charts). <br/><br />
 
 
-![Gifted charts](https://raw.githubusercontent.com/Abhinandan-Kushwaha/react-native-gifted-charts/14f8fa316ed9b2d6bd188ad73484c82fca857fe0/docs/dev/gifted-charts-architecture.drawio.svg)
+![Gifted charts](https://raw.githubusercontent.com/Abhinandan-Kushwaha/react-native-gifted-charts/db0b1034ed869c87db66998efb8588da76c7439a/docs/dev/gifted-charts-architecture.drawio.svg)

package/dist/BarChart/RenderStackBars.js

@@ -80,7 +80,6 @@ export var useRenderStackBars = function (props) {
         item.stacks.forEach(function (_, ind) {
             var value = _.value;
             sum += value > 0 ? getBarHeight(value, _.marginBottom) : 0;
-            console.log(ind, sum);
         });
         return sum;
     };

package/dist/RadarChart/index.d.ts

@@ -0,0 +1,77 @@
+import { GridConfig, RadarChartProps } from './types';
+export declare const useRadarChart: (props: RadarChartProps) => {
+    data: number[];
+    center: number;
+    radius: number;
+    chartSize: number;
+    noOfSections: number;
+    polarToCartesian: (angle: number, value: number) => {
+        x: number;
+        y: number;
+    };
+    labels: string[];
+    labelConfigArray: import("./types").LabelConfig[] | undefined;
+    labelsPositionOffset: number;
+    dataLabelConfigArray: import("./types").LabelConfig[] | undefined;
+    maxValue: number;
+    dataLabels: string[] | null;
+    gridSections: any[];
+    gridStroke: string;
+    gridStrokeWidth: number;
+    gridStrokeDashArray: number[];
+    gridFill: string;
+    gridGradientColor: string;
+    gridShowGradient: boolean;
+    gridOpacity: number;
+    gridGradientOpacity: number;
+    fontSize: number;
+    fontWeight: string;
+    fontFamily: string;
+    stroke: string;
+    textAnchor: string;
+    alignmentBaseline: string;
+    dataLabelsFontSize: number;
+    dataLabelsColor: string;
+    dataLabelsTextAnchor: string;
+    dataLabelsAlignmentBaseline: string;
+    dataLabelsPositionOffset: number;
+    dataLabelsFontWeight: string;
+    dataLabelsFontFamily: string;
+    polygonStroke: string;
+    polygonStrokeWidth: number;
+    polygonStrokeDashArray: number[];
+    polygonFill: string;
+    polygonGradientColor: string;
+    polygonShowGradient: boolean;
+    polygonOpacity: number;
+    polygonGradientOpacity: number;
+    asterLinesStroke: string;
+    asterLinesStrokeWidth: number;
+    asterLinesStrokeDashArray: number[];
+    points: {
+        x: number;
+        y: number;
+    }[];
+    polygonPoints: string;
+    angleStep: number;
+    circular: boolean;
+    hideGrid: boolean;
+    hideAsterLines: boolean;
+    getGridLevelProps: (gridItem: GridConfig, ind: number) => {
+        level: number;
+        gridGradientColorLocal: string;
+        gridFillColorLocal: string;
+        gridOpacityLocal: number;
+        gridGradientOpacityLocal: number;
+        gridStrokeLocal: string;
+        gridStrokeWidthLocal: number;
+        gridShowGradientLocal: boolean;
+        gridStrokeDashArrayLocal: number[];
+        levelPoints: {
+            x: number;
+            y: number;
+        }[];
+        levelPolygonPoints: string;
+        r: number;
+    };
+};

package/dist/RadarChart/index.js

@@ -0,0 +1,175 @@
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+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 { radarChartDefaults } from '../utils/constants';
+export var useRadarChart = function (props) {
+    var _a, _b, _c, _d, _e, _f, _g;
+    var _h = props.circular, circular = _h === void 0 ? false : _h, _j = props.gridConfig, gridConfig = _j === void 0 ? {} : _j, _k = props.polygonConfig, polygonConfig = _k === void 0 ? {} : _k, _l = props.data, data = _l === void 0 ? radarChartDefaults.data : _l, _m = props.noOfSections, noOfSections = _m === void 0 ? radarChartDefaults.noOfSections : _m, _o = props.chartSize, chartSize = _o === void 0 ? radarChartDefaults.chartSize : _o, _p = props.labelConfig, labelConfig = _p === void 0 ? {} : _p, labelConfigArray = props.labelConfigArray, _q = props.asterLinesConfig, asterLinesConfig = _q === void 0 ? {} : _q, _r = props.hideGrid, hideGrid = _r === void 0 ? radarChartDefaults.hideGrid : _r, _s = props.hideAsterLines, hideAsterLines = _s === void 0 ? (_a = props.hideGrid) !== null && _a !== void 0 ? _a : radarChartDefaults.hideAsterLines : _s, showdataValuesAsLabels = props.showdataValuesAsLabels, _t = props.dataLabelsConfig, dataLabelsConfig = _t === void 0 ? {} : _t, dataLabelConfigArray = props.dataLabelConfigArray, _u = props.labelsPositionOffset, labelsPositionOffset = _u === void 0 ? radarChartDefaults.labelsPositionOffset : _u, _v = props.dataLabelsPositionOffset, dataLabelsPositionOffset = _v === void 0 ? radarChartDefaults.dataLabelsPositionOffset : _v;
+    var labels = (_c = (_b = props.labels) !== null && _b !== void 0 ? _b : data === null || data === void 0 ? void 0 : data.map(function (_, index) { return "Label".concat(index + 1); })) !== null && _c !== void 0 ? _c : [];
+    var maxValue = (_d = props.maxValue) !== null && _d !== void 0 ? _d : Math.max.apply(Math, __spreadArray([], __read(data), false));
+    var dataLabels = (_e = props.dataLabels) !== null && _e !== void 0 ? _e : (showdataValuesAsLabels ? data.map(function (d) { return d.toString(); }) : null);
+    var polarToCartesian = function (angle, value) {
+        var radians = (Math.PI / 180) * angle;
+        return {
+            x: center + radius * (value / maxValue) * Math.cos(radians),
+            y: center - radius * (value / maxValue) * Math.sin(radians)
+        };
+    };
+    var center = chartSize / 2;
+    var radius = center * 0.8;
+    var _w = gridConfig.stroke, gridStroke = _w === void 0 ? radarChartDefaults.gridSection.stroke : _w, _x = gridConfig.strokeWidth, gridStrokeWidth = _x === void 0 ? radarChartDefaults.gridSection.strokeWidth : _x, _y = gridConfig.strokeDashArray, gridStrokeDashArray = _y === void 0 ? radarChartDefaults.gridSection
+        .strokeDashArray : _y, _z = gridConfig.fill, gridFill = _z === void 0 ? radarChartDefaults.gridSection.fill : _z, _0 = gridConfig.gradientColor, gridGradientColor = _0 === void 0 ? radarChartDefaults.gridSection
+        .gradientColor : _0, _1 = gridConfig.showGradient, gridShowGradient = _1 === void 0 ? radarChartDefaults.gridSection
+        .showGradient : _1, _2 = gridConfig.opacity, gridOpacity = _2 === void 0 ? radarChartDefaults.gridSection.opacity : _2, _3 = gridConfig.gradientOpacity, gridGradientOpacity = _3 === void 0 ? radarChartDefaults.gridSection
+        .gradientOpacity : _3;
+    var gridSections = (_g = (_f = gridConfig.gridSections) === null || _f === void 0 ? void 0 : _f.map(function (i) { return (__assign(__assign({}, radarChartDefaults.gridSection), i)); })) !== null && _g !== void 0 ? _g : Array(noOfSections).fill({});
+    var _4 = labelConfig.fontSize, fontSize = _4 === void 0 ? radarChartDefaults.labelConfig.fontSize : _4, _5 = labelConfig.stroke, stroke = _5 === void 0 ? radarChartDefaults.labelConfig.stroke : _5, _6 = labelConfig.textAnchor, textAnchor = _6 === void 0 ? radarChartDefaults.labelConfig.textAnchor : _6, _7 = labelConfig.alignmentBaseline, alignmentBaseline = _7 === void 0 ? radarChartDefaults.labelConfig.alignmentBaseline : _7, _8 = labelConfig.fontWeight, fontWeight = _8 === void 0 ? radarChartDefaults.labelConfig.fontWeight : _8, _9 = labelConfig.fontFamily, fontFamily = _9 === void 0 ? radarChartDefaults.labelConfig.fontFamily : _9;
+    var _10 = dataLabelsConfig.fontSize, dataLabelsFontSize = _10 === void 0 ? fontSize : _10, // defaults to labelConfig (from above)
+    _11 = dataLabelsConfig.stroke, // defaults to labelConfig (from above)
+    dataLabelsColor = _11 === void 0 ? stroke : _11, // defaults to labelConfig (from above)
+    _12 = dataLabelsConfig.textAnchor, // defaults to labelConfig (from above)
+    dataLabelsTextAnchor = _12 === void 0 ? textAnchor : _12, // defaults to labelConfig (from above)
+    _13 = dataLabelsConfig.alignmentBaseline, // defaults to labelConfig (from above)
+    dataLabelsAlignmentBaseline = _13 === void 0 ? alignmentBaseline : _13, // defaults to labelConfig (from above)
+    _14 = dataLabelsConfig.fontWeight, // defaults to labelConfig (from above)
+    dataLabelsFontWeight = _14 === void 0 ? fontWeight : _14, // defaults to labelConfig (from above)
+    _15 = dataLabelsConfig.fontFamily // defaults to labelConfig (from above)
+    , // defaults to labelConfig (from above)
+    dataLabelsFontFamily = _15 === void 0 ? fontFamily : _15 // defaults to labelConfig (from above)
+    ;
+    var _16 = polygonConfig.stroke, polygonStroke = _16 === void 0 ? radarChartDefaults.polygonConfig.stroke : _16, _17 = polygonConfig.strokeWidth, polygonStrokeWidth = _17 === void 0 ? radarChartDefaults.polygonConfig
+        .strokeWidth : _17, _18 = polygonConfig.strokeDashArray, polygonStrokeDashArray = _18 === void 0 ? radarChartDefaults.polygonConfig
+        .strokeDashArray : _18, _19 = polygonConfig.fill, polygonFill = _19 === void 0 ? radarChartDefaults.polygonConfig.fill : _19, _20 = polygonConfig.gradientColor, polygonGradientColor = _20 === void 0 ? radarChartDefaults.polygonConfig
+        .gradientColor : _20, _21 = polygonConfig.showGradient, polygonShowGradient = _21 === void 0 ? radarChartDefaults.polygonConfig
+        .showGradient : _21, _22 = polygonConfig.opacity, polygonOpacity = _22 === void 0 ? radarChartDefaults.polygonConfig.opacity : _22, _23 = polygonConfig.gradientOpacity, polygonGradientOpacity = _23 === void 0 ? polygonOpacity : _23;
+    var _24 = asterLinesConfig.stroke, asterLinesStroke = _24 === void 0 ? gridStroke : _24, _25 = asterLinesConfig.strokeWidth, asterLinesStrokeWidth = _25 === void 0 ? gridStrokeWidth : _25, _26 = asterLinesConfig.strokeDashArray, asterLinesStrokeDashArray = _26 === void 0 ? radarChartDefaults.asterLineStrokeDashArray : _26;
+    // Calculate angles for each category
+    var angleStep = 360 / labels.length;
+    // Generate coordinates for the data points
+    var points = data.map(function (value, index) {
+        var angle = index * angleStep;
+        return polarToCartesian(angle, value);
+    });
+    // Generate the polygon points for the radar chart (in SVG "x,y" format)
+    var polygonPoints = points.map(function (point) { return "".concat(point.x, ",").concat(point.y); }).join(' ');
+    var getGridLevelProps = function (gridItem, ind) {
+        var level = noOfSections - ind;
+        var gridGradientColorLocal = gridItem.gradientColor || gridGradientColor;
+        var gridFillColorLocal = gridItem.fill || gridFill;
+        var gridOpacityLocal = gridItem.opacity || gridOpacity;
+        var gridGradientOpacityLocal = gridItem.gradientOpacity || gridGradientOpacity;
+        var gridStrokeLocal = gridItem.stroke || gridStroke;
+        var gridStrokeWidthLocal = gridItem.strokeWidth || gridStrokeWidth;
+        var gridShowGradientLocal = gridItem.showGradient || gridShowGradient;
+        var gridStrokeDashArrayLocal = gridItem.strokeDashArray || gridStrokeDashArray;
+        var levelPoints = labels.map(function (_, index) {
+            var angle = index * angleStep;
+            return polarToCartesian(angle, (level / noOfSections) * maxValue);
+        });
+        var levelPolygonPoints = levelPoints
+            .map(function (point) { return "".concat(point.x, ",").concat(point.y); })
+            .join(' ');
+        var r = radius * (level / noOfSections);
+        return {
+            level: level,
+            gridGradientColorLocal: gridGradientColorLocal,
+            gridFillColorLocal: gridFillColorLocal,
+            gridOpacityLocal: gridOpacityLocal,
+            gridGradientOpacityLocal: gridGradientOpacityLocal,
+            gridStrokeLocal: gridStrokeLocal,
+            gridStrokeWidthLocal: gridStrokeWidthLocal,
+            gridShowGradientLocal: gridShowGradientLocal,
+            gridStrokeDashArrayLocal: gridStrokeDashArrayLocal,
+            levelPoints: levelPoints,
+            levelPolygonPoints: levelPolygonPoints,
+            r: r
+        };
+    };
+    return {
+        data: data,
+        center: center,
+        radius: radius,
+        chartSize: chartSize,
+        noOfSections: noOfSections,
+        polarToCartesian: polarToCartesian,
+        labels: labels,
+        labelConfigArray: labelConfigArray,
+        labelsPositionOffset: labelsPositionOffset,
+        dataLabelConfigArray: dataLabelConfigArray,
+        maxValue: maxValue,
+        dataLabels: dataLabels,
+        gridSections: gridSections,
+        gridStroke: gridStroke,
+        gridStrokeWidth: gridStrokeWidth,
+        gridStrokeDashArray: gridStrokeDashArray,
+        gridFill: gridFill,
+        gridGradientColor: gridGradientColor,
+        gridShowGradient: gridShowGradient,
+        gridOpacity: gridOpacity,
+        gridGradientOpacity: gridGradientOpacity,
+        fontSize: fontSize,
+        fontWeight: fontWeight,
+        fontFamily: fontFamily,
+        stroke: stroke,
+        textAnchor: textAnchor,
+        alignmentBaseline: alignmentBaseline,
+        dataLabelsFontSize: dataLabelsFontSize,
+        dataLabelsColor: dataLabelsColor,
+        dataLabelsTextAnchor: dataLabelsTextAnchor,
+        dataLabelsAlignmentBaseline: dataLabelsAlignmentBaseline,
+        dataLabelsPositionOffset: dataLabelsPositionOffset,
+        dataLabelsFontWeight: dataLabelsFontWeight,
+        dataLabelsFontFamily: dataLabelsFontFamily,
+        polygonStroke: polygonStroke,
+        polygonStrokeWidth: polygonStrokeWidth,
+        polygonStrokeDashArray: polygonStrokeDashArray,
+        polygonFill: polygonFill,
+        polygonGradientColor: polygonGradientColor,
+        polygonShowGradient: polygonShowGradient,
+        polygonOpacity: polygonOpacity,
+        polygonGradientOpacity: polygonGradientOpacity,
+        asterLinesStroke: asterLinesStroke,
+        asterLinesStrokeWidth: asterLinesStrokeWidth,
+        asterLinesStrokeDashArray: asterLinesStrokeDashArray,
+        points: points,
+        polygonPoints: polygonPoints,
+        angleStep: angleStep,
+        circular: circular,
+        hideGrid: hideGrid,
+        hideAsterLines: hideAsterLines,
+        getGridLevelProps: getGridLevelProps
+    };
+};

package/dist/RadarChart/types.d.ts

@@ -0,0 +1,52 @@
+export interface GridConfig extends StrokeFillAndGradient {
+    gridSections?: GridSectionConfig[];
+}
+export interface LabelConfig {
+    fontSize?: number;
+    stroke?: string;
+    textAnchor?: string;
+    alignmentBaseline?: string;
+    fontWeight?: string;
+    fontFamily?: string;
+}
+export interface RadarChartProps {
+    circular?: boolean;
+    gridConfig?: GridConfig;
+    data?: number[];
+    maxValue?: number;
+    noOfSections?: number;
+    chartSize?: number;
+    labelConfig?: LabelConfig;
+    labelConfigArray?: LabelConfig[];
+    labels?: string[];
+    dataLabels?: string[];
+    dataLabelConfig?: LabelConfig;
+    dataLabelConfigArray?: LabelConfig[];
+    showdataValuesAsLabels?: boolean;
+    polygonConfig?: PolygonConfig;
+    asterLinesConfig?: AsterLinesConfig;
+    hideAsterLines?: boolean;
+    hideGrid?: boolean;
+    hideLabels?: boolean;
+    dataLabelsConfig?: LabelConfig;
+    labelsPositionOffset?: number;
+    dataLabelsPositionOffset?: number;
+}
+export interface StrokeConfig {
+    stroke?: string;
+    strokeWidth?: number;
+    strokeDashArray?: number[];
+}
+export interface StrokeFillAndGradient extends StrokeConfig {
+    fill?: string;
+    gradientColor?: string;
+    showGradient?: boolean;
+    opacity?: number;
+    gradientOpacity?: number;
+}
+export interface PolygonConfig extends StrokeFillAndGradient {
+}
+export interface GridSectionConfig extends StrokeFillAndGradient {
+}
+export interface AsterLinesConfig extends StrokeConfig {
+}

package/dist/RadarChart/types.js

@@ -0,0 +1 @@
+export {};

package/dist/index.d.ts

@@ -25,6 +25,11 @@ export { type PieChartPropsType, type pieDataItem, type PieChartMainProps } from
 export { usePopulationPyramid } from './PopulationPyramid';
 export { type popnPyramidDataItem, type popnPyramidDataItemReactJS, type RulesProps, type RulesPropsReactJS, type RulesPropsType, type PopulationPyramidPropsType, type PopulationPyramidPropsTypeReactJS, type TPopulationPyramidPropsType, type extendedPopulationPyramidPropsType } from './PopulationPyramid/types';
 /***********************************************************************************************************************
+/************************************                Radar Chart                    ************************************
+/***********************************************************************************************************************/
+export { useRadarChart } from './RadarChart';
+export { type RadarChartProps, type PolygonConfig, type GridConfig, type GridSectionConfig, type AsterLinesConfig } from './RadarChart/types';
+/***********************************************************************************************************************
 /************************************             Common Components                 ************************************
 /***********************************************************************************************************************/
 export { useAnimatedThreeDBar } from './components/AnimatedThreeDBar';

package/dist/index.js

@@ -21,6 +21,10 @@ export { getPieChartMainProps } from './PieChart/main';
 /***********************************************************************************************************************/
 export { usePopulationPyramid } from './PopulationPyramid';
 /***********************************************************************************************************************
+/************************************                Radar Chart                    ************************************
+/***********************************************************************************************************************/
+export { useRadarChart } from './RadarChart';
+/***********************************************************************************************************************
 /************************************             Common Components                 ************************************
 /***********************************************************************************************************************/
 export { useAnimatedThreeDBar } from './components/AnimatedThreeDBar';

package/dist/utils/constants.d.ts

@@ -265,3 +265,40 @@ export declare const PieTooltipDefaults: {
     tooltipBackgroundColor: string;
     tooltipBorderRadius: number;
 };
+export declare const radarChartDefaults: {
+    data: never[];
+    noOfSections: number;
+    chartSize: number;
+    hideAsterLines: boolean;
+    hideGrid: boolean;
+    labelsPositionOffset: number;
+    dataLabelsPositionOffset: number;
+    gridSection: {
+        stroke: string;
+        strokeWidth: number;
+        fill: string;
+        gradientColor: string;
+        showGradient: boolean;
+        strokeDashArray: number[];
+        opacity: number;
+        gradientOpacity: number;
+    };
+    labelConfig: {
+        fontSize: number;
+        stroke: string;
+        textAnchor: string;
+        alignmentBaseline: string;
+        fontWeight: string;
+        fontFamily: string;
+    };
+    polygonConfig: {
+        stroke: string;
+        strokeWidth: number;
+        strokeDashArray: number[];
+        fill: string;
+        gradientColor: string;
+        showGradient: boolean;
+        opacity: number;
+    };
+    asterLineStrokeDashArray: number[];
+};

package/dist/utils/constants.js

@@ -318,3 +318,40 @@ export var PieTooltipDefaults = {
     tooltipBackgroundColor: 'rgba(20,20,20,0.8)',
     tooltipBorderRadius: 4
 };
+export var radarChartDefaults = {
+    data: [],
+    noOfSections: 4,
+    chartSize: 300,
+    hideAsterLines: false,
+    hideGrid: false,
+    labelsPositionOffset: 5,
+    dataLabelsPositionOffset: 5,
+    gridSection: {
+        stroke: 'lightgray',
+        strokeWidth: 1,
+        fill: '#bbb',
+        gradientColor: 'white',
+        showGradient: true,
+        strokeDashArray: [0, 0],
+        opacity: 1,
+        gradientOpacity: 1
+    },
+    labelConfig: {
+        fontSize: 12,
+        stroke: 'black',
+        textAnchor: 'middle',
+        alignmentBaseline: 'middle',
+        fontWeight: 'normal',
+        fontFamily: 'Arial'
+    },
+    polygonConfig: {
+        stroke: '#027bff',
+        strokeWidth: 2,
+        strokeDashArray: [0, 0],
+        fill: 'skyblue',
+        gradientColor: 'lightgray',
+        showGradient: false,
+        opacity: 0.7,
+    },
+    asterLineStrokeDashArray: [4, 4]
+};

package/package.json

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