@fluentui/react-charting 5.21.14 → 5.21.16

package/lib/utilities/utilities.js

@@ -2,11 +2,11 @@ var _a;
 import { __assign, __spreadArray } from "tslib";
 import { axisRight as d3AxisRight, axisBottom as d3AxisBottom, axisLeft as d3AxisLeft } from 'd3-axis';
 import { max as d3Max, min as d3Min } from 'd3-array';
-import { scaleLinear as d3ScaleLinear, scaleBand as d3ScaleBand, scaleUtc as d3ScaleUtc } from 'd3-scale';
+import { scaleLinear as d3ScaleLinear, scaleBand as d3ScaleBand, scaleUtc as d3ScaleUtc, scaleTime as d3ScaleTime, } from 'd3-scale';
 import { select as d3Select, selectAll as d3SelectAll } from 'd3-selection';
 import { format as d3Format } from 'd3-format';
-import { timeFormat as d3TimeFormat, timeFormatLocale as d3TimeFormatLocale, } from 'd3-time-format';
-import { timeSecond as d3TimeSecond, timeMinute as d3TimeMinute, timeHour as d3TimeHour, timeDay as d3TimeDay, timeMonth as d3TimeMonth, timeWeek as d3TimeWeek, timeYear as d3TimeYear, } from 'd3-time';
+import { timeFormat as d3TimeFormat, timeFormatLocale as d3TimeFormatLocale, utcFormat as d3UtcFormat, } from 'd3-time-format';
+import { timeSecond as d3TimeSecond, timeMinute as d3TimeMinute, timeHour as d3TimeHour, timeDay as d3TimeDay, timeMonth as d3TimeMonth, timeWeek as d3TimeWeek, timeYear as d3TimeYear, utcSecond as d3UtcSecond, utcMinute as d3UtcMinute, utcHour as d3UtcHour, utcDay as d3UtcDay, utcMonth as d3UtcMonth, utcWeek as d3UtcWeek, utcYear as d3UtcYear, } from 'd3-time';
 import { formatPrefix as d3FormatPrefix } from 'd3-format';
 export var ChartTypes;
 (function (ChartTypes) {
@@ -58,8 +58,8 @@ export function createNumericXAxis(xAxisParams, chartType, culture) {
     var tickValues = xAxisScale.ticks(xAxisCount).map(xAxis.tickFormat());
     return { xScale: xAxisScale, tickValues: tickValues };
 }
-function multiFormat(date, locale) {
-    var timeFormat = locale ? locale.format : d3TimeFormat;
+function multiFormat(date, locale, useUTC) {
+    var timeFormat = locale ? (useUTC ? locale.utcFormat : locale.format) : useUTC ? d3UtcFormat : d3TimeFormat;
     var formatMillisecond = timeFormat('.%L');
     var formatSecond = timeFormat(':%S');
     var formatMinute = timeFormat('%I:%M');
@@ -68,19 +68,26 @@ function multiFormat(date, locale) {
     var formatWeek = timeFormat('%b %d');
     var formatMonth = timeFormat('%B');
     var formatYear = timeFormat('%Y');
-    return (d3TimeSecond(date) < date
+    var timeSecond = useUTC ? d3UtcSecond : d3TimeSecond;
+    var timeMinute = useUTC ? d3UtcMinute : d3TimeMinute;
+    var timeHour = useUTC ? d3UtcHour : d3TimeHour;
+    var timeDay = useUTC ? d3UtcDay : d3TimeDay;
+    var timeMonth = useUTC ? d3UtcMonth : d3TimeMonth;
+    var timeWeek = useUTC ? d3UtcWeek : d3TimeWeek;
+    var timeYear = useUTC ? d3UtcYear : d3TimeYear;
+    return (timeSecond(date) < date
         ? formatMillisecond
-        : d3TimeMinute(date) < date
+        : timeMinute(date) < date
             ? formatSecond
-            : d3TimeHour(date) < date
+            : timeHour(date) < date
                 ? formatMinute
-                : d3TimeDay(date) < date
+                : timeDay(date) < date
                     ? formatHour
-                    : d3TimeMonth(date) < date
-                        ? d3TimeWeek(date) < date
+                    : timeMonth(date) < date
+                        ? timeWeek(date) < date
                             ? formatDay
                             : formatWeek
-                        : d3TimeYear(date) < date
+                        : timeYear(date) < date
                             ? formatMonth
                             : formatYear)(date);
 }
@@ -90,10 +97,11 @@ function multiFormat(date, locale) {
  * @param {IXAxisParams} xAxisParams
  * @param {ITickParams} tickParams
  */
-export function createDateXAxis(xAxisParams, tickParams, culture, options, timeFormatLocale, customDateTimeFormatter) {
+export function createDateXAxis(xAxisParams, tickParams, culture, options, timeFormatLocale, customDateTimeFormatter, useUTC) {
     var _a;
     var domainNRangeValues = xAxisParams.domainNRangeValues, xAxisElement = xAxisParams.xAxisElement, _b = xAxisParams.tickPadding, tickPadding = _b === void 0 ? 6 : _b, _c = xAxisParams.xAxistickSize, xAxistickSize = _c === void 0 ? 6 : _c, _d = xAxisParams.xAxisCount, xAxisCount = _d === void 0 ? 6 : _d;
-    var xAxisScale = d3ScaleUtc()
+    var xAxisScale = useUTC ? d3ScaleUtc() : d3ScaleTime();
+    xAxisScale
         .domain([domainNRangeValues.dStartValue, domainNRangeValues.dEndValue])
         .range([domainNRangeValues.rStartValue, domainNRangeValues.rEndValue]);
     var xAxis = d3AxisBottom(xAxisScale).tickSize(xAxistickSize).tickPadding(tickPadding).ticks(xAxisCount);
@@ -110,12 +118,14 @@ export function createDateXAxis(xAxisParams, tickParams, culture, options, timeF
     else if (timeFormatLocale) {
         var locale_1 = d3TimeFormatLocale(timeFormatLocale);
         xAxis.tickFormat(function (domainValue, _index) {
-            return multiFormat(domainValue, locale_1);
+            return multiFormat(domainValue, locale_1, useUTC);
         });
     }
     tickParams.tickValues ? xAxis.tickValues(tickParams.tickValues) : '';
     if (culture === undefined) {
-        tickParams.tickFormat ? xAxis.tickFormat(d3TimeFormat(tickParams.tickFormat)) : '';
+        tickParams.tickFormat
+            ? xAxis.tickFormat(useUTC ? d3UtcFormat(tickParams.tickFormat) : d3TimeFormat(tickParams.tickFormat))
+            : '';
     }
     if (xAxisElement) {
         d3Select(xAxisElement).call(xAxis).selectAll('text').attr('aria-hidden', 'true');
@@ -123,7 +133,7 @@ export function createDateXAxis(xAxisParams, tickParams, culture, options, timeF
     var tickValues = ((_a = tickParams.tickValues) !== null && _a !== void 0 ? _a : xAxisScale.ticks(xAxisCount)).map(function (val, idx) {
         var tickFormat = xAxis.tickFormat();
         // val is a Date object. So when the tick format is not set, format val as a string to calculate its width
-        return tickFormat ? tickFormat(val, idx) : multiFormat(val);
+        return tickFormat ? tickFormat(val, idx) : multiFormat(val, undefined, useUTC);
     });
     return { xScale: xAxisScale, tickValues: tickValues };
 }
@@ -177,22 +187,7 @@ export function prepareDatapoints(maxVal, minVal, splitInto, isIntegralDataset)
     }
     return dataPointsArray;
 }
-/**
- * Creating Numeric Y axis of the chart
- * @export
- * @param {IYAxisParams} yAxisParams
- * @param {boolean} isRtl
- */
-export function createYAxis(yAxisParams, isRtl, axisData, chartType, barWidth, isIntegralDataset, useSecondaryYScale) {
-    if (useSecondaryYScale === void 0) { useSecondaryYScale = false; }
-    switch (chartType) {
-        case ChartTypes.HorizontalBarChartWithAxis:
-            return createYAxisForHorizontalBarChartWithAxis(yAxisParams, isRtl, axisData, barWidth);
-        default:
-            return createYAxisForOtherCharts(yAxisParams, isRtl, axisData, isIntegralDataset, useSecondaryYScale);
-    }
-}
-export function createYAxisForHorizontalBarChartWithAxis(yAxisParams, isRtl, axisData, barWidth) {
+export function createYAxisForHorizontalBarChartWithAxis(yAxisParams, isRtl) {
     var _a = yAxisParams.yMinMaxValues, yMinMaxValues = _a === void 0 ? { startValue: 0, endValue: 0 } : _a, _b = yAxisParams.yAxisElement, yAxisElement = _b === void 0 ? null : _b, _c = yAxisParams.yMaxValue, yMaxValue = _c === void 0 ? 0 : _c, _d = yAxisParams.yMinValue, yMinValue = _d === void 0 ? 0 : _d, containerHeight = yAxisParams.containerHeight, margins = yAxisParams.margins, _e = yAxisParams.tickPadding, tickPadding = _e === void 0 ? 12 : _e, _f = yAxisParams.maxOfYVal, maxOfYVal = _f === void 0 ? 0 : _f, yAxisTickFormat = yAxisParams.yAxisTickFormat, _g = yAxisParams.yAxisTickCount, yAxisTickCount = _g === void 0 ? 4 : _g;
     // maxOfYVal coming from only area chart and Grouped vertical bar chart(Calculation done at base file)
     var tempVal = maxOfYVal || yMinMaxValues.endValue;
@@ -207,7 +202,7 @@ export function createYAxisForHorizontalBarChartWithAxis(yAxisParams, isRtl, axi
     yAxisElement ? d3Select(yAxisElement).call(yAxis).selectAll('text').attr('aria-hidden', 'true') : '';
     return yAxisScale;
 }
-export function createYAxisForOtherCharts(yAxisParams, isRtl, axisData, isIntegralDataset, useSecondaryYScale) {
+export function createNumericYAxis(yAxisParams, isRtl, axisData, isIntegralDataset, useSecondaryYScale) {
     if (useSecondaryYScale === void 0) { useSecondaryYScale = false; }
     var _a = yAxisParams.yMinMaxValues, yMinMaxValues = _a === void 0 ? { startValue: 0, endValue: 0 } : _a, _b = yAxisParams.yAxisElement, yAxisElement = _b === void 0 ? null : _b, _c = yAxisParams.yMaxValue, yMaxValue = _c === void 0 ? 0 : _c, _d = yAxisParams.yMinValue, yMinValue = _d === void 0 ? 0 : _d, containerHeight = yAxisParams.containerHeight, containerWidth = yAxisParams.containerWidth, margins = yAxisParams.margins, _e = yAxisParams.tickPadding, tickPadding = _e === void 0 ? 12 : _e, _f = yAxisParams.maxOfYVal, maxOfYVal = _f === void 0 ? 0 : _f, yAxisTickFormat = yAxisParams.yAxisTickFormat, _g = yAxisParams.yAxisTickCount, yAxisTickCount = _g === void 0 ? 4 : _g, eventAnnotationProps = yAxisParams.eventAnnotationProps, eventLabelHeight = yAxisParams.eventLabelHeight;
     // maxOfYVal coming from only area chart and Grouped vertical bar chart(Calculation done at base file)
@@ -228,21 +223,13 @@ export function createYAxisForOtherCharts(yAxisParams, isRtl, axisData, isIntegr
     axisData.yAxisDomainValues = domainValues;
     return yAxisScale;
 }
-export var createStringYAxis = function (yAxisParams, dataPoints, isRtl, chartType, barWidth, culture) {
-    switch (chartType) {
-        case ChartTypes.HorizontalBarChartWithAxis:
-            return createStringYAxisForHorizontalBarChartWithAxis(yAxisParams, dataPoints, isRtl, barWidth, culture);
-        default:
-            return createStringYAxisForOtherCharts(yAxisParams, dataPoints, isRtl);
-    }
-};
 /**
  * Creating String Y axis of the chart for Horizontal Bar Chart With Axis
  * @param yAxisParams
  * @param dataPoints
  * @param isRtl
  */
-export var createStringYAxisForHorizontalBarChartWithAxis = function (yAxisParams, dataPoints, isRtl, barWidth, culture) {
+export var createStringYAxisForHorizontalBarChartWithAxis = function (yAxisParams, dataPoints, isRtl, barWidth) {
     var containerHeight = yAxisParams.containerHeight, _a = yAxisParams.tickPadding, tickPadding = _a === void 0 ? 12 : _a, margins = yAxisParams.margins, yAxisTickFormat = yAxisParams.yAxisTickFormat, yAxisElement = yAxisParams.yAxisElement;
     var yAxisScale = d3ScaleBand()
         .domain(dataPoints)
@@ -261,7 +248,7 @@ export var createStringYAxisForHorizontalBarChartWithAxis = function (yAxisParam
  * @param dataPoints
  * @param isRtl
  */
-export var createStringYAxisForOtherCharts = function (yAxisParams, dataPoints, isRtl) {
+export var createStringYAxis = function (yAxisParams, dataPoints, isRtl) {
     var containerHeight = yAxisParams.containerHeight, _a = yAxisParams.tickPadding, tickPadding = _a === void 0 ? 12 : _a, margins = yAxisParams.margins, yAxisTickFormat = yAxisParams.yAxisTickFormat, yAxisElement = yAxisParams.yAxisElement, _b = yAxisParams.yAxisPadding, yAxisPadding = _b === void 0 ? 0 : _b;
     var yAxisScale = d3ScaleBand()
         .domain(dataPoints)
@@ -463,7 +450,7 @@ export function createWrapOfXLabels(wrapLabelProps) {
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
 export function createYAxisLabels(node, 
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
-yAxis, noOfCharsToTruncate, truncateLabel, xValue, isRtl) {
+yAxis, noOfCharsToTruncate, truncateLabel, isRtl) {
     if (node === null) {
         return;
     }
@@ -754,70 +741,6 @@ export function domainRageOfVerticalNumeric(points, margins, containerWidth, isR
         ? { dStartValue: xMax, dEndValue: xMin, rStartValue: rMin, rEndValue: rMax }
         : { dStartValue: xMin, dEndValue: xMax, rStartValue: rMin, rEndValue: rMax };
 }
-/**
- * For creating X axis, need to calculate x axis domain and range values from given points.
- * This may vary based on chart type and type of x axis
- * So, this method will define which method need to call based on chart type and axis type.
- * @export
- * @param {*} points
- * @param {IMargins} margins
- * @param {number} width
- * @param {ChartTypes} chartType
- * @param {boolean} isRTL
- * @param {XAxisTypes} xAxisType
- * @param {number} [barWidth]
- * @returns {IDomainNRange}
- */
-export function getDomainNRangeValues(
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-points, margins, width, chartType, isRTL, xAxisType, barWidth, tickValues, shiftX) {
-    var domainNRangeValue;
-    if (xAxisType === XAxisTypes.NumericAxis) {
-        switch (chartType) {
-            case ChartTypes.AreaChart:
-            case ChartTypes.LineChart:
-                domainNRangeValue = domainRangeOfNumericForAreaChart(points, margins, width, isRTL);
-                break;
-            case ChartTypes.VerticalStackedBarChart:
-                domainNRangeValue = domainRangeOfVSBCNumeric(points, margins, width, isRTL, barWidth);
-                break;
-            case ChartTypes.VerticalBarChart:
-                domainNRangeValue = domainRageOfVerticalNumeric(points, margins, width, isRTL, barWidth);
-                break;
-            case ChartTypes.HorizontalBarChartWithAxis:
-                domainNRangeValue = domainRangeOfNumericForHorizontalBarChartWithAxis(points, margins, width, isRTL, shiftX);
-                break;
-            default:
-                domainNRangeValue = { dStartValue: 0, dEndValue: 0, rStartValue: 0, rEndValue: 0 };
-        }
-    }
-    else if (xAxisType === XAxisTypes.DateAxis) {
-        switch (chartType) {
-            case ChartTypes.AreaChart:
-            case ChartTypes.LineChart:
-            case ChartTypes.VerticalBarChart:
-            case ChartTypes.VerticalStackedBarChart:
-                domainNRangeValue = domainRangeOfDateForAreaLineVerticalBarChart(points, margins, width, isRTL, tickValues, chartType, barWidth);
-                break;
-            default:
-                domainNRangeValue = { dStartValue: 0, dEndValue: 0, rStartValue: 0, rEndValue: 0 };
-        }
-    }
-    else {
-        // String Axis type
-        switch (chartType) {
-            case ChartTypes.VerticalStackedBarChart:
-            case ChartTypes.GroupedVerticalBarChart:
-            case ChartTypes.VerticalBarChart:
-            case ChartTypes.HeatMapChart:
-                domainNRangeValue = domainRangeOfXStringAxis(margins, width, isRTL);
-                break;
-            default:
-                domainNRangeValue = { dStartValue: 0, dEndValue: 0, rStartValue: 0, rEndValue: 0 };
-        }
-    }
-    return domainNRangeValue;
-}
 /**
  * Calculating start and ending values of the Area chart and LineChart
  * @export
@@ -896,40 +819,6 @@ export function findHBCWANumericMinMaxOfY(points, yAxisType) {
     }
     return { startValue: 0, endValue: 0 };
 }
-/**
- * For creating Y axis, need to calculate y axis domain values from given points. This may vary based on chart type.
- * So, this method will define which method need to call based on chart type to find out min and max values(For Domain).
- * For grouped vertical bar chart, Calculating yMax value in the base file and sending as MaxOfYVal to cartesian.
- * @export
- * @param {*} points
- * @param {ChartTypes} chartType
- * @returns {{ startValue: number; endValue: number }}
- */
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-export function getMinMaxOfYAxis(
-// eslint-disable-next-line @typescript-eslint/no-explicit-any
-points, chartType, yAxisType) {
-    if (yAxisType === void 0) { yAxisType = YAxisType.NumericAxis; }
-    var minMaxValues;
-    switch (chartType) {
-        case ChartTypes.AreaChart:
-        case ChartTypes.LineChart:
-            minMaxValues = findNumericMinMaxOfY(points);
-            break;
-        case ChartTypes.VerticalStackedBarChart:
-            minMaxValues = findVSBCNumericMinMaxOfY(points);
-            break;
-        case ChartTypes.VerticalBarChart:
-            minMaxValues = findVerticalNumericMinMaxOfY(points);
-            break;
-        case ChartTypes.HorizontalBarChartWithAxis:
-            minMaxValues = findHBCWANumericMinMaxOfY(points, yAxisType);
-            break;
-        default:
-            minMaxValues = { startValue: 0, endValue: 0 };
-    }
-    return minMaxValues;
-}
 /**
  * @param p string or number or Date
  *
@@ -1156,4 +1045,8 @@ export var getScalePadding = function (prop, shorthandProp, defaultValue) {
 export var isScalePaddingDefined = function (prop, shorthandProp) {
     return typeof prop === 'number' || typeof shorthandProp === 'number';
 };
+export var formatDate = function (date, useUTC) {
+    var timeFormat = useUTC ? d3UtcFormat : d3TimeFormat;
+    return timeFormat('%-e %b %Y, %H:%M')(date) + (useUTC ? ' GMT' : '');
+};
 //# sourceMappingURL=utilities.js.map