@fluentui/react-charting 5.24.2 → 5.24.4

package/lib-amd/utilities/utilities.js

@@ -2,7 +2,7 @@ define(["require", "exports", "tslib", "d3-axis", "d3-array", "d3-scale", "d3-se
     "use strict";
     var _a;
     Object.defineProperty(exports, "__esModule", { value: true });
-    exports.truncateString = exports.getCurveFactory = exports.createMeasurementSpan = exports.copyStyle = exports.resolveCSSVariables = exports.areArraysEqual = exports.getSecureProps = exports.isScalePaddingDefined = exports.getScalePadding = exports.getBarWidth = exports.formatScientificLimitWidth = exports.wrapTextInsideDonut = exports.rotateXAxisLabels = exports.getAccessibleDataObject = exports.pointTypes = exports.CustomPoints = exports.Points = exports.getTypeOfAxis = exports.findHBCWANumericMinMaxOfY = exports.findVerticalNumericMinMaxOfY = exports.findVSBCNumericMinMaxOfY = exports.findNumericMinMaxOfY = exports.domainRageOfVerticalNumeric = exports.domainRangeOfDateForAreaLineVerticalBarChart = exports.domainRangeOfVSBCNumeric = exports.domainRangeOfXStringAxis = exports.domainRangeOfNumericForHorizontalBarChartWithAxis = exports.computeLongestBars = exports.groupChartDataByYValue = exports.domainRangeOfNumericForAreaChart = exports.getXAxisType = exports.tooltipOfAxislabels = exports.calculateLongestLabelWidth = exports.wrapContent = exports.createYAxisLabels = exports.createWrapOfXLabels = exports.silceOrAppendToArray = exports.getUnique = exports.calloutData = exports.createStringYAxis = exports.createStringYAxisForHorizontalBarChartWithAxis = exports.createNumericYAxis = exports.createYAxisForHorizontalBarChartWithAxis = exports.prepareDatapoints = exports.createStringXAxis = exports.createDateXAxis = exports.createNumericXAxis = exports.defaultYAxisTickFormatter = exports.YAxisType = exports.XAxisTypes = exports.ChartTypes = exports.MIN_DONUT_RADIUS = exports.MIN_DOMAIN_MARGIN = void 0;
+    exports.sortAxisCategories = exports.truncateString = exports.domainRangeOfNumericForScatterChart = exports.domainRangeOfDateForScatterChart = exports.getCurveFactory = exports.createMeasurementSpan = exports.copyStyle = exports.resolveCSSVariables = exports.areArraysEqual = exports.getSecureProps = exports.isScalePaddingDefined = exports.getScalePadding = exports.getBarWidth = exports.formatScientificLimitWidth = exports.wrapTextInsideDonut = exports.rotateXAxisLabels = exports.getAccessibleDataObject = exports.pointTypes = exports.CustomPoints = exports.Points = exports.getTypeOfAxis = exports.findHBCWANumericMinMaxOfY = exports.findVerticalNumericMinMaxOfY = exports.findVSBCNumericMinMaxOfY = exports.findNumericMinMaxOfY = exports.domainRageOfVerticalNumeric = exports.domainRangeOfDateForAreaLineVerticalBarChart = exports.domainRangeOfVSBCNumeric = exports.domainRangeOfXStringAxis = exports.domainRangeOfNumericForHorizontalBarChartWithAxis = exports.computeLongestBars = exports.groupChartDataByYValue = exports.domainRangeOfNumericForAreaChart = exports.getXAxisType = exports.tooltipOfAxislabels = exports.calculateLongestLabelWidth = exports.wrapContent = exports.createYAxisLabels = exports.createWrapOfXLabels = exports.silceOrAppendToArray = exports.getUnique = exports.calloutData = exports.createStringYAxis = exports.createStringYAxisForHorizontalBarChartWithAxis = exports.createNumericYAxis = exports.createYAxisForHorizontalBarChartWithAxis = exports.prepareDatapoints = exports.createStringXAxis = exports.createDateXAxis = exports.createNumericXAxis = exports.defaultYAxisTickFormatter = exports.YAxisType = exports.XAxisTypes = exports.ChartTypes = exports.MIN_DONUT_RADIUS = exports.MIN_DOMAIN_MARGIN = void 0;
     exports.MIN_DOMAIN_MARGIN = 8;
     exports.MIN_DONUT_RADIUS = 1;
     var ChartTypes;
@@ -14,6 +14,7 @@ define(["require", "exports", "tslib", "d3-axis", "d3-array", "d3-scale", "d3-se
         ChartTypes[ChartTypes["GroupedVerticalBarChart"] = 4] = "GroupedVerticalBarChart";
         ChartTypes[ChartTypes["HeatMapChart"] = 5] = "HeatMapChart";
         ChartTypes[ChartTypes["HorizontalBarChartWithAxis"] = 6] = "HorizontalBarChartWithAxis";
+        ChartTypes[ChartTypes["ScatterChart"] = 7] = "ScatterChart";
     })(ChartTypes || (exports.ChartTypes = ChartTypes = {}));
     var XAxisTypes;
     (function (XAxisTypes) {
@@ -471,6 +472,8 @@ define(["require", "exports", "tslib", "d3-axis", "d3-array", "d3-scale", "d3-se
      * This methos creates an object for those 2 charts.
      * @param values
      */
+    // changing the type to any as it is used by multiple charts with different data types
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     function calloutData(values) {
         var combinedResult = [];
         values.forEach(function (line) {
@@ -482,6 +485,7 @@ define(["require", "exports", "tslib", "d3-axis", "d3-array", "d3-scale", "d3-se
             combinedResult = combinedResult.concat(elements);
         });
         var xValToDataPoints = {};
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         combinedResult.forEach(function (ele) {
             var xValue = ele.x instanceof Date ? ele.x.getTime() : ele.x;
             if (xValue in xValToDataPoints) {
@@ -510,7 +514,8 @@ define(["require", "exports", "tslib", "d3-axis", "d3-array", "d3-scale", "d3-se
             }
         });
         var result = Object.keys(xValToDataPoints).map(function (xValue) {
-            return { x: Number(xValue), values: xValToDataPoints[xValue] };
+            var originalXValue = isNaN(Number(xValue)) ? xValue : Number(xValue);
+            return { x: originalXValue, values: xValToDataPoints[xValue] };
         });
         return result;
     }
@@ -1375,6 +1380,76 @@ define(["require", "exports", "tslib", "d3-axis", "d3-array", "d3-scale", "d3-se
         }
     }
     exports.getCurveFactory = getCurveFactory;
+    /**
+     * Calculates Domain and range values for Date X axis for scatter chart.
+     * @export
+     * @param {LineChartPoints[]} points
+     * @param {IMargins} margins
+     * @param {number} width
+     * @param {boolean} isRTL
+     * @param {Date[] | number[]} tickValues
+     * @returns {IDomainNRange}
+     */
+    function domainRangeOfDateForScatterChart(points, margins, width, isRTL, tickValues) {
+        if (tickValues === void 0) { tickValues = []; }
+        var sDate;
+        var lDate;
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        sDate = (0, d3_array_1.min)(points, function (point) {
+            return (0, d3_array_1.min)(point.data, function (item) {
+                return item.x;
+            });
+        });
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+        lDate = (0, d3_array_1.max)(points, function (point) {
+            return (0, d3_array_1.max)(point.data, function (item) {
+                return item.x;
+            });
+        });
+        var xPadding = (lDate.getTime() - sDate.getTime()) * 0.1;
+        sDate = new Date(sDate.getTime() - xPadding);
+        lDate = new Date(lDate.getTime() + xPadding);
+        // Need to draw graph with given small and large date
+        // (Which Involves customization of date axis tick values)
+        // That may be Either from given graph data or from prop 'tickValues' date values.
+        // So, Finding smallest and largest dates
+        sDate = (0, d3_array_1.min)(tslib_1.__spreadArray(tslib_1.__spreadArray([], tickValues, true), [sDate], false));
+        lDate = (0, d3_array_1.max)(tslib_1.__spreadArray(tslib_1.__spreadArray([], tickValues, true), [lDate], false));
+        var rStartValue = margins.left;
+        var rEndValue = width - margins.right;
+        return isRTL
+            ? { dStartValue: lDate, dEndValue: sDate, rStartValue: rStartValue, rEndValue: rEndValue }
+            : { dStartValue: sDate, dEndValue: lDate, rStartValue: rStartValue, rEndValue: rEndValue };
+    }
+    exports.domainRangeOfDateForScatterChart = domainRangeOfDateForScatterChart;
+    /**
+     * Calculates Domain and range values for Numeric X axis for scatter chart.
+     * @export
+     * @param {LineChartPoints[]} points
+     * @param {IMargins} margins
+     * @param {number} width
+     * @param {boolean} isRTL
+     * @returns {IDomainNRange}
+     */
+    function domainRangeOfNumericForScatterChart(points, margins, width, isRTL) {
+        var xMin = (0, d3_array_1.min)(points, function (point) {
+            return (0, d3_array_1.min)(point.data, function (item) { return item.x; });
+        });
+        var xMax = (0, d3_array_1.max)(points, function (point) {
+            return (0, d3_array_1.max)(point.data, function (item) {
+                return item.x;
+            });
+        });
+        var xPadding = (xMax - xMin) * 0.1;
+        xMin = xMin - xPadding;
+        xMax = xMax + xPadding;
+        var rStartValue = margins.left;
+        var rEndValue = width - margins.right;
+        return isRTL
+            ? { dStartValue: xMax, dEndValue: xMin, rStartValue: rStartValue, rEndValue: rEndValue }
+            : { dStartValue: xMin, dEndValue: xMax, rStartValue: rStartValue, rEndValue: rEndValue };
+    }
+    exports.domainRangeOfNumericForScatterChart = domainRangeOfNumericForScatterChart;
     var truncateString = function (str, maxLength, ellipsis) {
         if (ellipsis === void 0) { ellipsis = '...'; }
         if (str.length <= maxLength) {
@@ -1383,5 +1458,63 @@ define(["require", "exports", "tslib", "d3-axis", "d3-array", "d3-scale", "d3-se
         return str.slice(0, maxLength) + ellipsis;
     };
     exports.truncateString = truncateString;
+    var categoryOrderRegex = /(category|total|sum|min|max|mean|median) (ascending|descending)/;
+    /**
+     * @see {@link https://github.com/plotly/plotly.js/blob/master/src/plots/plots.js#L3041}
+     */
+    var sortAxisCategories = function (categoryToValues, categoryOrder) {
+        if (Array.isArray(categoryOrder)) {
+            var result_1 = [];
+            var seen_1 = new Set();
+            // Add elements from categoryOrder array that are in categoryToValues, in the array's order
+            categoryOrder.forEach(function (category) {
+                if (categoryToValues[category] && !seen_1.has(category)) {
+                    result_1.push(category);
+                    seen_1.add(category);
+                }
+            });
+            // Append any keys from categoryToValues not already in result
+            Object.keys(categoryToValues).forEach(function (category) {
+                if (!seen_1.has(category)) {
+                    result_1.push(category);
+                }
+            });
+            return result_1;
+        }
+        var match = categoryOrder === null || categoryOrder === void 0 ? void 0 : categoryOrder.match(categoryOrderRegex);
+        if (match) {
+            var aggregator_1 = match[1];
+            var order = match[2];
+            if (aggregator_1 === 'category') {
+                var result = Object.keys(categoryToValues).sort();
+                return order === 'descending' ? result.reverse() : result;
+            }
+            var aggFn_1 = {
+                min: d3_array_1.min,
+                max: d3_array_1.max,
+                sum: d3_array_1.sum,
+                total: d3_array_1.sum,
+                mean: d3_array_1.mean,
+                median: d3_array_1.median,
+            };
+            var sortAscending = function (a, b) {
+                return a[1] - b[1];
+            };
+            var sortDescending = function (a, b) {
+                return b[1] - a[1];
+            };
+            var categoriesAggregatedValue_1 = [];
+            Object.keys(categoryToValues).forEach(function (category) {
+                categoriesAggregatedValue_1.push([category, aggFn_1[aggregator_1](categoryToValues[category]) || 0]);
+            });
+            categoriesAggregatedValue_1.sort(order === 'descending' ? sortDescending : sortAscending);
+            return categoriesAggregatedValue_1.map(function (_a) {
+                var category = _a[0];
+                return category;
+            });
+        }
+        return Object.keys(categoryToValues);
+    };
+    exports.sortAxisCategories = sortAxisCategories;
 });
 //# sourceMappingURL=utilities.js.map