@fluentui/react-charting 5.24.6 → 5.24.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.json +28 -1
- package/CHANGELOG.md +13 -2
- package/dist/react-charting.js +1 -1
- package/dist/react-charting.min.js +1 -1
- package/lib/components/CommonComponents/CartesianChart.base.d.ts +3 -2
- package/lib/components/CommonComponents/CartesianChart.base.js +118 -102
- package/lib/components/CommonComponents/CartesianChart.base.js.map +1 -1
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js +13 -10
- package/lib/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +15 -24
- package/lib/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
- package/lib/components/VerticalBarChart/VerticalBarChart.base.js +14 -12
- package/lib/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js +13 -17
- package/lib/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js.map +1 -1
- package/lib/utilities/utilities.d.ts +3 -0
- package/lib/utilities/utilities.js +25 -38
- package/lib/utilities/utilities.js.map +1 -1
- package/lib/utilities/vbc-utils.d.ts +18 -0
- package/lib/utilities/vbc-utils.js +29 -0
- package/lib/utilities/vbc-utils.js.map +1 -1
- package/lib-amd/components/CommonComponents/CartesianChart.base.d.ts +3 -2
- package/lib-amd/components/CommonComponents/CartesianChart.base.js +117 -101
- package/lib-amd/components/CommonComponents/CartesianChart.base.js.map +1 -1
- package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js +13 -10
- package/lib-amd/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +14 -23
- package/lib-amd/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
- package/lib-amd/components/VerticalBarChart/VerticalBarChart.base.js +13 -11
- package/lib-amd/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
- package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js +12 -16
- package/lib-amd/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js.map +1 -1
- package/lib-amd/utilities/utilities.d.ts +3 -0
- package/lib-amd/utilities/utilities.js +26 -39
- package/lib-amd/utilities/utilities.js.map +1 -1
- package/lib-amd/utilities/vbc-utils.d.ts +18 -0
- package/lib-amd/utilities/vbc-utils.js +34 -1
- package/lib-amd/utilities/vbc-utils.js.map +1 -1
- package/lib-commonjs/components/CommonComponents/CartesianChart.base.d.ts +3 -2
- package/lib-commonjs/components/CommonComponents/CartesianChart.base.js +117 -101
- package/lib-commonjs/components/CommonComponents/CartesianChart.base.js.map +1 -1
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js +13 -10
- package/lib-commonjs/components/DeclarativeChart/PlotlySchemaAdapter.js.map +1 -1
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js +14 -23
- package/lib-commonjs/components/GroupedVerticalBarChart/GroupedVerticalBarChart.base.js.map +1 -1
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.base.js +13 -11
- package/lib-commonjs/components/VerticalBarChart/VerticalBarChart.base.js.map +1 -1
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js +12 -16
- package/lib-commonjs/components/VerticalStackedBarChart/VerticalStackedBarChart.base.js.map +1 -1
- package/lib-commonjs/utilities/utilities.d.ts +3 -0
- package/lib-commonjs/utilities/utilities.js +27 -40
- package/lib-commonjs/utilities/utilities.js.map +1 -1
- package/lib-commonjs/utilities/vbc-utils.d.ts +18 -0
- package/lib-commonjs/utilities/vbc-utils.js +34 -1
- package/lib-commonjs/utilities/vbc-utils.js.map +1 -1
- package/package.json +1 -1
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
var _a;
|
|
3
3
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
4
|
-
exports.
|
|
5
|
-
exports.sortAxisCategories = exports.truncateString = exports.domainRangeOfNumericForScatterChart = exports.domainRangeOfDateForScatterChart = exports.getCurveFactory = exports.createMeasurementSpan = void 0;
|
|
4
|
+
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.DEFAULT_WRAP_WIDTH = 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;
|
|
5
|
+
exports.sortAxisCategories = exports.truncateString = exports.domainRangeOfNumericForScatterChart = exports.domainRangeOfDateForScatterChart = exports.getCurveFactory = exports.createMeasurementSpan = exports.copyStyle = void 0;
|
|
6
6
|
var tslib_1 = require("tslib");
|
|
7
7
|
var d3_axis_1 = require("d3-axis");
|
|
8
8
|
var d3_array_1 = require("d3-array");
|
|
@@ -75,7 +75,7 @@ exports.defaultYAxisTickFormatter = defaultYAxisTickFormatter;
|
|
|
75
75
|
*/
|
|
76
76
|
function createNumericXAxis(xAxisParams, tickParams, chartType, culture) {
|
|
77
77
|
var _a;
|
|
78
|
-
var domainNRangeValues = xAxisParams.domainNRangeValues, _b = xAxisParams.showRoundOffXTickValues, showRoundOffXTickValues = _b === void 0 ? true : _b, _c = xAxisParams.xAxistickSize, xAxistickSize = _c === void 0 ? 6 : _c, _d = xAxisParams.tickPadding, tickPadding = _d === void 0 ? 10 : _d, xAxisCount = xAxisParams.xAxisCount, xAxisElement = xAxisParams.xAxisElement, hideTickOverlap = xAxisParams.hideTickOverlap;
|
|
78
|
+
var domainNRangeValues = xAxisParams.domainNRangeValues, _b = xAxisParams.showRoundOffXTickValues, showRoundOffXTickValues = _b === void 0 ? true : _b, _c = xAxisParams.xAxistickSize, xAxistickSize = _c === void 0 ? 6 : _c, _d = xAxisParams.tickPadding, tickPadding = _d === void 0 ? 10 : _d, xAxisCount = xAxisParams.xAxisCount, xAxisElement = xAxisParams.xAxisElement, hideTickOverlap = xAxisParams.hideTickOverlap, calcMaxLabelWidth = xAxisParams.calcMaxLabelWidth;
|
|
79
79
|
var xAxisScale = (0, d3_scale_1.scaleLinear)()
|
|
80
80
|
.domain([domainNRangeValues.dStartValue, domainNRangeValues.dEndValue])
|
|
81
81
|
.range([domainNRangeValues.rStartValue, domainNRangeValues.rEndValue]);
|
|
@@ -89,7 +89,7 @@ function createNumericXAxis(xAxisParams, tickParams, chartType, culture) {
|
|
|
89
89
|
return (0, chart_utilities_1.formatToLocaleString)(xAxisValue, culture);
|
|
90
90
|
};
|
|
91
91
|
if (hideTickOverlap && typeof xAxisCount === 'undefined') {
|
|
92
|
-
var longestLabelWidth = (
|
|
92
|
+
var longestLabelWidth = calcMaxLabelWidth(xAxisScale.ticks().map(tickFormat)) + 20;
|
|
93
93
|
var _e = xAxisScale.range(), start = _e[0], end = _e[1];
|
|
94
94
|
tickCount = Math.min(Math.max(1, Math.floor(Math.abs(end - start) / longestLabelWidth)), 10);
|
|
95
95
|
}
|
|
@@ -215,7 +215,7 @@ function isPowerOf10(num) {
|
|
|
215
215
|
*/
|
|
216
216
|
function createDateXAxis(xAxisParams, tickParams, culture, options, timeFormatLocale, customDateTimeFormatter, useUTC) {
|
|
217
217
|
var _a;
|
|
218
|
-
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, xAxisCount = xAxisParams.xAxisCount;
|
|
218
|
+
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, xAxisCount = xAxisParams.xAxisCount, calcMaxLabelWidth = xAxisParams.calcMaxLabelWidth;
|
|
219
219
|
var xAxisScale = useUTC ? (0, d3_scale_1.scaleUtc)() : (0, d3_scale_1.scaleTime)();
|
|
220
220
|
xAxisScale
|
|
221
221
|
.domain([domainNRangeValues.dStartValue, domainNRangeValues.dEndValue])
|
|
@@ -253,7 +253,7 @@ function createDateXAxis(xAxisParams, tickParams, culture, options, timeFormatLo
|
|
|
253
253
|
}
|
|
254
254
|
return (0, chart_utilities_1.formatDateToLocaleString)(domainValue, culture, useUTC, false, formatOptions);
|
|
255
255
|
};
|
|
256
|
-
var longestLabelWidth = (
|
|
256
|
+
var longestLabelWidth = calcMaxLabelWidth(xAxisScale.ticks().map(tickFormat)) + 40;
|
|
257
257
|
var _d = xAxisScale.range(), start = _d[0], end = _d[1];
|
|
258
258
|
var maxPossibleTickCount = Math.min(Math.max(1, Math.floor(Math.abs(end - start) / longestLabelWidth)), 10);
|
|
259
259
|
tickCount = Math.min(maxPossibleTickCount, xAxisCount !== null && xAxisCount !== void 0 ? xAxisCount : tickCount);
|
|
@@ -281,7 +281,7 @@ exports.createDateXAxis = createDateXAxis;
|
|
|
281
281
|
*/
|
|
282
282
|
function createStringXAxis(xAxisParams, tickParams, dataset, culture) {
|
|
283
283
|
var _a;
|
|
284
|
-
var domainNRangeValues = xAxisParams.domainNRangeValues, _b = xAxisParams.xAxistickSize, xAxistickSize = _b === void 0 ? 6 : _b, _c = xAxisParams.tickPadding, tickPadding = _c === void 0 ? 10 : _c, _d = xAxisParams.xAxisPadding, xAxisPadding = _d === void 0 ? 0.1 : _d, xAxisInnerPadding = xAxisParams.xAxisInnerPadding, xAxisOuterPadding = xAxisParams.xAxisOuterPadding, containerWidth = xAxisParams.containerWidth, hideTickOverlap = xAxisParams.hideTickOverlap;
|
|
284
|
+
var domainNRangeValues = xAxisParams.domainNRangeValues, _b = xAxisParams.xAxistickSize, xAxistickSize = _b === void 0 ? 6 : _b, _c = xAxisParams.tickPadding, tickPadding = _c === void 0 ? 10 : _c, _d = xAxisParams.xAxisPadding, xAxisPadding = _d === void 0 ? 0.1 : _d, xAxisInnerPadding = xAxisParams.xAxisInnerPadding, xAxisOuterPadding = xAxisParams.xAxisOuterPadding, containerWidth = xAxisParams.containerWidth, hideTickOverlap = xAxisParams.hideTickOverlap, calcMaxLabelWidth = xAxisParams.calcMaxLabelWidth;
|
|
285
285
|
var xAxisScale = (0, d3_scale_1.scaleBand)()
|
|
286
286
|
.domain(dataset)
|
|
287
287
|
.range([domainNRangeValues.rStartValue, domainNRangeValues.rEndValue])
|
|
@@ -293,7 +293,7 @@ function createStringXAxis(xAxisParams, tickParams, dataset, culture) {
|
|
|
293
293
|
// Here, we need the width of each individual label to detect overlaps,
|
|
294
294
|
// but calculateLongestLabelWidth returns the maximum pixel width from an array of labels.
|
|
295
295
|
// So call this function separately for each label, instead of the entire array.
|
|
296
|
-
var tickSizes = tickValues.map(function (value) { return (
|
|
296
|
+
var tickSizes = tickValues.map(function (value) { return calcMaxLabelWidth([value]); });
|
|
297
297
|
// for LTR
|
|
298
298
|
var start = 0;
|
|
299
299
|
var end = containerWidth;
|
|
@@ -407,10 +407,10 @@ function createNumericYAxis(yAxisParams, isRtl, axisData, isIntegralDataset, use
|
|
|
407
407
|
if (roundedTicks === void 0) { roundedTicks = false; }
|
|
408
408
|
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;
|
|
409
409
|
// maxOfYVal coming from only area chart and Grouped vertical bar chart(Calculation done at base file)
|
|
410
|
-
var tempVal = maxOfYVal || yMinMaxValues.endValue;
|
|
410
|
+
var tempVal = maxOfYVal || yMinMaxValues.endValue || 0;
|
|
411
411
|
var finalYmax = tempVal > yMaxValue ? tempVal : yMaxValue;
|
|
412
412
|
var finalYmin = supportNegativeData
|
|
413
|
-
? Math.min(yMinMaxValues.startValue, yMinValue || 0)
|
|
413
|
+
? Math.min(yMinMaxValues.startValue || 0, yMinValue || 0)
|
|
414
414
|
: yMinMaxValues.startValue < yMinValue
|
|
415
415
|
? 0
|
|
416
416
|
: yMinValue;
|
|
@@ -566,6 +566,7 @@ function silceOrAppendToArray(array, value) {
|
|
|
566
566
|
}
|
|
567
567
|
}
|
|
568
568
|
exports.silceOrAppendToArray = silceOrAppendToArray;
|
|
569
|
+
exports.DEFAULT_WRAP_WIDTH = 10;
|
|
569
570
|
/**
|
|
570
571
|
* This method used for wrapping of x axis labels (tick values).
|
|
571
572
|
* It breaks down given text value by space separated and calculates the total height needed to display all the words.
|
|
@@ -576,21 +577,19 @@ exports.silceOrAppendToArray = silceOrAppendToArray;
|
|
|
576
577
|
* @returns
|
|
577
578
|
*/
|
|
578
579
|
function createWrapOfXLabels(wrapLabelProps) {
|
|
579
|
-
var node = wrapLabelProps.node, xAxis = wrapLabelProps.xAxis, noOfCharsToTruncate = wrapLabelProps.noOfCharsToTruncate, showXAxisLablesTooltip = wrapLabelProps.showXAxisLablesTooltip;
|
|
580
|
+
var node = wrapLabelProps.node, xAxis = wrapLabelProps.xAxis, noOfCharsToTruncate = wrapLabelProps.noOfCharsToTruncate, showXAxisLablesTooltip = wrapLabelProps.showXAxisLablesTooltip, _a = wrapLabelProps.width, width = _a === void 0 ? exports.DEFAULT_WRAP_WIDTH : _a;
|
|
580
581
|
if (node === null) {
|
|
581
582
|
return;
|
|
582
583
|
}
|
|
583
584
|
var axisNode = (0, d3_selection_1.select)(node).call(xAxis);
|
|
584
585
|
var removeVal = 0;
|
|
585
|
-
var
|
|
586
|
-
var arr = [];
|
|
586
|
+
var maxLines = 1;
|
|
587
587
|
axisNode.selectAll('.tick text').each(function () {
|
|
588
588
|
var text = (0, d3_selection_1.select)(this);
|
|
589
589
|
var totalWord = text.text();
|
|
590
590
|
var truncatedWord = "".concat(text.text().slice(0, noOfCharsToTruncate), "...");
|
|
591
591
|
var totalWordLength = text.text().length;
|
|
592
592
|
var words = text.text().split(/\s+/).reverse();
|
|
593
|
-
arr.push(words.length);
|
|
594
593
|
var word = '';
|
|
595
594
|
var line = [];
|
|
596
595
|
var lineNumber = 0;
|
|
@@ -611,7 +610,7 @@ function createWrapOfXLabels(wrapLabelProps) {
|
|
|
611
610
|
.attr('id', 'showDots')
|
|
612
611
|
.attr('x', 0)
|
|
613
612
|
.attr('y', y)
|
|
614
|
-
.attr('dy',
|
|
613
|
+
.attr('dy', dy + 'em')
|
|
615
614
|
.text(truncatedWord);
|
|
616
615
|
}
|
|
617
616
|
else if (showXAxisLablesTooltip && totalWordLength <= noOfCharsToTruncate) {
|
|
@@ -620,7 +619,7 @@ function createWrapOfXLabels(wrapLabelProps) {
|
|
|
620
619
|
.attr('id', 'LessLength')
|
|
621
620
|
.attr('x', 0)
|
|
622
621
|
.attr('y', y)
|
|
623
|
-
.attr('dy',
|
|
622
|
+
.attr('dy', dy + 'em')
|
|
624
623
|
.text(totalWord);
|
|
625
624
|
}
|
|
626
625
|
else {
|
|
@@ -640,32 +639,20 @@ function createWrapOfXLabels(wrapLabelProps) {
|
|
|
640
639
|
.text(word);
|
|
641
640
|
}
|
|
642
641
|
}
|
|
643
|
-
var maxDigit = Math.max.apply(Math, arr);
|
|
644
|
-
var maxHeight_1 = 12; // intial value to render corretly first time
|
|
645
|
-
axisNode.selectAll('text').each(function () {
|
|
646
|
-
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
647
|
-
var outerHTMLElement = document.getElementById('WordBreakId');
|
|
648
|
-
var BoxCordinates = outerHTMLElement && outerHTMLElement.getBoundingClientRect();
|
|
649
|
-
var boxHeight = BoxCordinates && BoxCordinates.height;
|
|
650
|
-
if (boxHeight > maxHeight_1) {
|
|
651
|
-
maxHeight_1 = boxHeight;
|
|
652
|
-
}
|
|
653
|
-
});
|
|
654
|
-
// If we take directly maxDigit * maxheight, then it will show more height between x axis tick values and bottom.
|
|
655
|
-
// To avoid this, reducing maxDigit value by removing some digit based on legth of word.
|
|
656
|
-
var removeDigit = 4;
|
|
657
|
-
if (maxDigit <= 2) {
|
|
658
|
-
removeDigit = 1;
|
|
659
|
-
}
|
|
660
|
-
else if (maxDigit > 2 && maxDigit <= 6) {
|
|
661
|
-
removeDigit = 2;
|
|
662
|
-
}
|
|
663
|
-
else if (maxDigit > 6 && maxDigit <= 9) {
|
|
664
|
-
removeDigit = 3;
|
|
665
|
-
}
|
|
666
|
-
removeVal = (maxDigit - removeDigit) * maxHeight_1;
|
|
667
642
|
}
|
|
643
|
+
maxLines = Math.max(maxLines, lineNumber + 1);
|
|
668
644
|
});
|
|
645
|
+
if (!showXAxisLablesTooltip) {
|
|
646
|
+
var maxHeight = 12; // intial value to render corretly first time
|
|
647
|
+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
648
|
+
var outerHTMLElement = document.getElementById('WordBreakId');
|
|
649
|
+
var BoxCordinates = outerHTMLElement && outerHTMLElement.getBoundingClientRect();
|
|
650
|
+
var boxHeight = BoxCordinates && BoxCordinates.height;
|
|
651
|
+
if (boxHeight > maxHeight) {
|
|
652
|
+
maxHeight = boxHeight;
|
|
653
|
+
}
|
|
654
|
+
removeVal = (maxLines - 1) * maxHeight;
|
|
655
|
+
}
|
|
669
656
|
return removeVal > 0 ? removeVal : 0;
|
|
670
657
|
}
|
|
671
658
|
exports.createWrapOfXLabels = createWrapOfXLabels;
|