@fluentui/react-charting 5.24.2 → 5.24.4

package/lib-commonjs/utilities/utilities.js

@@ -2,7 +2,7 @@
 var _a;
 Object.defineProperty(exports, "__esModule", { value: true });
 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.truncateString = exports.getCurveFactory = exports.createMeasurementSpan = void 0;
+exports.sortAxisCategories = exports.truncateString = exports.domainRangeOfNumericForScatterChart = exports.domainRangeOfDateForScatterChart = exports.getCurveFactory = exports.createMeasurementSpan = void 0;
 var tslib_1 = require("tslib");
 var d3_axis_1 = require("d3-axis");
 var d3_array_1 = require("d3-array");
@@ -26,6 +26,7 @@ var ChartTypes;
     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) {
@@ -483,6 +484,8 @@ exports.createStringYAxis = createStringYAxis;
  * 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) {
@@ -494,6 +497,7 @@ function calloutData(values) {
         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) {
@@ -522,7 +526,8 @@ function calloutData(values) {
         }
     });
     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;
 }
@@ -1387,6 +1392,76 @@ function getCurveFactory(curve, defaultFactory) {
     }
 }
 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) {
@@ -1395,4 +1470,62 @@ var truncateString = function (str, maxLength, ellipsis) {
     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