pace-chart-lib 1.0.2 → 1.0.4

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.
Files changed (131) hide show
  1. package/dist/{components → Components}/Charts/ChartsWithAxis/ChartsWithAxisFunctions.d.ts +76 -38
  2. package/dist/{components → Components}/Charts/ChartsWithoutAxis/ChartsWithoutAxisTypes.types.d.ts +4 -2
  3. package/dist/{components → Components}/Charts/Core/CommonFunctions.d.ts +3 -1
  4. package/dist/{components → Components}/Charts/Core/DefaultProperties.types.d.ts +2 -0
  5. package/dist/index.d.ts +1 -0
  6. package/dist/pace-chart-lib.es.js +54619 -0
  7. package/dist/pace-chart-lib.umd.js +54622 -0
  8. package/dist/vite.svg +1 -0
  9. package/package.json +1 -1
  10. package/dist/Services/ErrorLog.js +0 -3
  11. package/dist/components/Charts/ChartsWithAxis/AreaFamily/AreaChart.js +0 -496
  12. package/dist/components/Charts/ChartsWithAxis/AreaFamily/LineChart.d.ts +0 -4
  13. package/dist/components/Charts/ChartsWithAxis/AreaFamily/LineChart.js +0 -491
  14. package/dist/components/Charts/ChartsWithAxis/AreaFamily/NormalizedStackAreaChart.js +0 -517
  15. package/dist/components/Charts/ChartsWithAxis/AreaFamily/NormalizedStackLineChart.d.ts +0 -4
  16. package/dist/components/Charts/ChartsWithAxis/AreaFamily/NormalizedStackLineChart.js +0 -553
  17. package/dist/components/Charts/ChartsWithAxis/AreaFamily/StackAreaChart.js +0 -517
  18. package/dist/components/Charts/ChartsWithAxis/AreaFamily/StackLineChart.d.ts +0 -4
  19. package/dist/components/Charts/ChartsWithAxis/AreaFamily/StackLineChart.js +0 -553
  20. package/dist/components/Charts/ChartsWithAxis/BarFamily/BarChart.d.ts +0 -12
  21. package/dist/components/Charts/ChartsWithAxis/BarFamily/BarChart.js +0 -9
  22. package/dist/components/Charts/ChartsWithAxis/ChartsWithAxisFunctions.js +0 -4909
  23. package/dist/components/Charts/ChartsWithAxis/ChartsWithAxisTypes.type.d.ts +0 -0
  24. package/dist/components/Charts/ChartsWithAxis/ChartsWithAxisTypes.type.js +0 -0
  25. package/dist/components/Charts/ChartsWithAxis/ChartsWithAxisTypes.types.js +0 -49
  26. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/ColumnChart copy.d.ts +0 -4
  27. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/ColumnChart copy.js +0 -486
  28. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/ColumnChart.js +0 -497
  29. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/ColumnHistogramChart.js +0 -418
  30. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/CustomColumnChart.js +0 -1013
  31. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/LayeredColumnChart.js +0 -478
  32. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/LineChart.d.ts +0 -4
  33. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/LineChart.js +0 -451
  34. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/NormalizedStackColumnChart.js +0 -533
  35. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/NormalizedStackLineChart.js +0 -512
  36. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/StackColumnChart.js +0 -530
  37. package/dist/components/Charts/ChartsWithAxis/ColumnFamily/StackLineChart.js +0 -512
  38. package/dist/components/Charts/ChartsWithAxis/HorizontalBarFamily/BarChart.d.ts +0 -12
  39. package/dist/components/Charts/ChartsWithAxis/HorizontalBarFamily/BarChart.js +0 -9
  40. package/dist/components/Charts/ChartsWithAxis/HorizontalBarFamily/HorizontalBarChart.js +0 -497
  41. package/dist/components/Charts/ChartsWithAxis/HorizontalBarFamily/HorizontalHistogramChart.js +0 -497
  42. package/dist/components/Charts/ChartsWithAxis/HorizontalBarFamily/LayeredColumnChart.d.ts +0 -4
  43. package/dist/components/Charts/ChartsWithAxis/HorizontalBarFamily/LayeredColumnChart.js +0 -479
  44. package/dist/components/Charts/ChartsWithAxis/HorizontalBarFamily/LayeredHorizontalBarChart.js +0 -478
  45. package/dist/components/Charts/ChartsWithAxis/HorizontalBarFamily/NormalizedStackHorizontalBarChart.js +0 -473
  46. package/dist/components/Charts/ChartsWithAxis/HorizontalBarFamily/StackHorizontalBarChart.js +0 -465
  47. package/dist/components/Charts/ChartsWithAxis/LineFamily/100%StackLineChart.d.ts +0 -0
  48. package/dist/components/Charts/ChartsWithAxis/LineFamily/100%StackLineChart.js +0 -0
  49. package/dist/components/Charts/ChartsWithAxis/LineFamily/LineChart.js +0 -451
  50. package/dist/components/Charts/ChartsWithAxis/LineFamily/NormalisedStackLineChart.d.ts +0 -4
  51. package/dist/components/Charts/ChartsWithAxis/LineFamily/NormalisedStackLineChart.js +0 -554
  52. package/dist/components/Charts/ChartsWithAxis/LineFamily/NormalizedStackLineChart.d.ts +0 -4
  53. package/dist/components/Charts/ChartsWithAxis/LineFamily/NormalizedStackLineChart.js +0 -510
  54. package/dist/components/Charts/ChartsWithAxis/LineFamily/StackLineChart.d.ts +0 -4
  55. package/dist/components/Charts/ChartsWithAxis/LineFamily/StackLineChart.js +0 -507
  56. package/dist/components/Charts/ChartsWithAxis/MiscellaneousChartFamily/TornadoChart.js +0 -393
  57. package/dist/components/Charts/ChartsWithAxis/MiscellaneousChartFamily/WaterfallChart.js +0 -606
  58. package/dist/components/Charts/ChartsWithoutAxis/ChartsWithoutAxis.types.d.ts +0 -0
  59. package/dist/components/Charts/ChartsWithoutAxis/ChartsWithoutAxis.types.js +0 -0
  60. package/dist/components/Charts/ChartsWithoutAxis/ChartsWithoutAxisFunctions.js +0 -815
  61. package/dist/components/Charts/ChartsWithoutAxis/ChartsWithoutAxisTypes.type.d.ts +0 -0
  62. package/dist/components/Charts/ChartsWithoutAxis/ChartsWithoutAxisTypes.type.js +0 -0
  63. package/dist/components/Charts/ChartsWithoutAxis/ChartsWithoutAxisTypes.types.js +0 -32
  64. package/dist/components/Charts/ChartsWithoutAxis/Maps/Cordinates.js +0 -15021
  65. package/dist/components/Charts/ChartsWithoutAxis/Maps/Maps.js +0 -391
  66. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/BubbleChart.js +0 -367
  67. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/OrganizationChart.js +0 -570
  68. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/ProgressChart.js +0 -212
  69. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/PyramidChart.js +0 -401
  70. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/RadialBarChart.js +0 -313
  71. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/SankeyChart.js +0 -719
  72. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/ScatterChart.js +0 -807
  73. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/Speedometer.js +0 -514
  74. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/VennChart.js +0 -282
  75. package/dist/components/Charts/ChartsWithoutAxis/OtherCharts/WordCloud.js +0 -207
  76. package/dist/components/Charts/ChartsWithoutAxis/PieFamily/DonutChart.js +0 -476
  77. package/dist/components/Charts/ChartsWithoutAxis/PieFamily/PieChart.js +0 -420
  78. package/dist/components/Charts/ChartsWithoutAxis/PieFamily/PieFamilyCommonFunctions.js +0 -106
  79. package/dist/components/Charts/ChartsWithoutAxis/PieFamily/PieofPieChart.js +0 -507
  80. package/dist/components/Charts/ChartsWithoutAxis/PieFamily/TreemapChart.js +0 -246
  81. package/dist/components/Charts/Core/Common.type.d.ts +0 -0
  82. package/dist/components/Charts/Core/Common.type.js +0 -0
  83. package/dist/components/Charts/Core/Common.types.js +0 -133
  84. package/dist/components/Charts/Core/CommonFunctions.js +0 -1782
  85. package/dist/components/Charts/Core/DefaultChartDataProperties.js +0 -64
  86. package/dist/components/Charts/Core/DefaultProperties.d.ts +0 -0
  87. package/dist/components/Charts/Core/DefaultProperties.js +0 -0
  88. package/dist/components/Charts/Core/DefaultProperties.type.d.ts +0 -586
  89. package/dist/components/Charts/Core/DefaultProperties.type.js +0 -585
  90. package/dist/components/Charts/Core/DefaultProperties.types.js +0 -592
  91. package/dist/index.js +0 -40
  92. /package/dist/{components → Components}/Charts/ChartsWithAxis/AreaFamily/AreaChart.d.ts +0 -0
  93. /package/dist/{components → Components}/Charts/ChartsWithAxis/AreaFamily/NormalizedStackAreaChart.d.ts +0 -0
  94. /package/dist/{components → Components}/Charts/ChartsWithAxis/AreaFamily/StackAreaChart.d.ts +0 -0
  95. /package/dist/{components → Components}/Charts/ChartsWithAxis/ChartsWithAxisTypes.types.d.ts +0 -0
  96. /package/dist/{components → Components}/Charts/ChartsWithAxis/ColumnFamily/ColumnChart.d.ts +0 -0
  97. /package/dist/{components → Components}/Charts/ChartsWithAxis/ColumnFamily/ColumnHistogramChart.d.ts +0 -0
  98. /package/dist/{components → Components}/Charts/ChartsWithAxis/ColumnFamily/CustomColumnChart.d.ts +0 -0
  99. /package/dist/{components → Components}/Charts/ChartsWithAxis/ColumnFamily/LayeredColumnChart.d.ts +0 -0
  100. /package/dist/{components → Components}/Charts/ChartsWithAxis/ColumnFamily/NormalizedStackColumnChart.d.ts +0 -0
  101. /package/dist/{components → Components}/Charts/ChartsWithAxis/ColumnFamily/StackColumnChart.d.ts +0 -0
  102. /package/dist/{components → Components}/Charts/ChartsWithAxis/HorizontalBarFamily/HorizontalBarChart.d.ts +0 -0
  103. /package/dist/{components → Components}/Charts/ChartsWithAxis/HorizontalBarFamily/HorizontalHistogramChart.d.ts +0 -0
  104. /package/dist/{components → Components}/Charts/ChartsWithAxis/HorizontalBarFamily/LayeredHorizontalBarChart.d.ts +0 -0
  105. /package/dist/{components → Components}/Charts/ChartsWithAxis/HorizontalBarFamily/NormalizedStackHorizontalBarChart.d.ts +0 -0
  106. /package/dist/{components → Components}/Charts/ChartsWithAxis/HorizontalBarFamily/StackHorizontalBarChart.d.ts +0 -0
  107. /package/dist/{components → Components}/Charts/ChartsWithAxis/LineFamily/LineChart.d.ts +0 -0
  108. /package/dist/{components/Charts/ChartsWithAxis/ColumnFamily → Components/Charts/ChartsWithAxis/LineFamily}/NormalizedStackLineChart.d.ts +0 -0
  109. /package/dist/{components/Charts/ChartsWithAxis/ColumnFamily → Components/Charts/ChartsWithAxis/LineFamily}/StackLineChart.d.ts +0 -0
  110. /package/dist/{components → Components}/Charts/ChartsWithAxis/MiscellaneousChartFamily/TornadoChart.d.ts +0 -0
  111. /package/dist/{components → Components}/Charts/ChartsWithAxis/MiscellaneousChartFamily/WaterfallChart.d.ts +0 -0
  112. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/ChartsWithoutAxisFunctions.d.ts +0 -0
  113. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/Maps/Cordinates.d.ts +0 -0
  114. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/Maps/Maps.d.ts +0 -0
  115. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/BubbleChart.d.ts +0 -0
  116. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/OrganizationChart.d.ts +0 -0
  117. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/ProgressChart.d.ts +0 -0
  118. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/PyramidChart.d.ts +0 -0
  119. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/RadialBarChart.d.ts +0 -0
  120. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/SankeyChart.d.ts +0 -0
  121. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/ScatterChart.d.ts +0 -0
  122. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/Speedometer.d.ts +0 -0
  123. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/VennChart.d.ts +0 -0
  124. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/OtherCharts/WordCloud.d.ts +0 -0
  125. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/PieFamily/DonutChart.d.ts +0 -0
  126. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/PieFamily/PieChart.d.ts +0 -0
  127. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/PieFamily/PieFamilyCommonFunctions.d.ts +0 -0
  128. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/PieFamily/PieofPieChart.d.ts +0 -0
  129. /package/dist/{components → Components}/Charts/ChartsWithoutAxis/PieFamily/TreemapChart.d.ts +0 -0
  130. /package/dist/{components → Components}/Charts/Core/Common.types.d.ts +0 -0
  131. /package/dist/{components → Components}/Charts/Core/DefaultChartDataProperties.d.ts +0 -0
@@ -1,497 +0,0 @@
1
- import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
- //#region Imports
3
- import * as d3 from "d3";
4
- import * as d3Annotation from "d3-svg-annotation";
5
- import { useEffect, useRef } from "react";
6
- import { logError } from "../../../../Services/ErrorLog";
7
- import { staticLegendShape } from "../../Core/Common.types";
8
- import { drawLegends, generalizedChartData, hideTooltipOnMouseOut, showTooltipOnMouseMove, } from "../../Core/CommonFunctions";
9
- import { addDataTable, commonAnnotations, customYscaleLabelFormatting, dataTablePreCalculation, firstFunctionBeforeRender, getNumberWithFormat, initChartArea, initPlotArea, initSvg, initXaxisBar, initXaxisTop, initYaxisBar, marginCalculation, prepareDataForSeriesLabel, responsiveSecondaryYaxisLabel, responsiveXaxisLabel, responsiveYaxisLabel, setChartTitle, setDateFormats, setXaxistitle, yAxistitle, yAxistitleRight } from "../ChartsWithAxisFunctions";
10
- import { actualChartTypes, } from "../ChartsWithAxisTypes.types";
11
- const HorizontalHistogramChart = ({ isDateType, formatOptions, data, }) => {
12
- // adding variables as per requirement
13
- const chartId = crypto.randomUUID();
14
- let columnWidth = 0; // coz line chartO
15
- const chartType = actualChartTypes.horizontalBar;
16
- const svgRef = useRef();
17
- const seriesData = generalizedChartData(data.ChartData, data.DimensionList);
18
- const dimensionList = data.DimensionList;
19
- const barChart = true;
20
- let isSecondaryAxisDrawn = false;
21
- const isNormalizedChart = false;
22
- let isPrimaryAxisDrawn = true;
23
- let customYaxisMinValue = parseFloat(formatOptions.yAxisLabel.yAxisMinText);
24
- let customYaxisMaxValue = parseFloat(formatOptions.yAxisLabel.yAxisMaxText);
25
- let secondaryCustomYaxisMinValue = parseFloat(formatOptions.secondaryYAxisLabel.secondaryYAxisMinText);
26
- let secondaryCustomYaxisMaxValue = parseFloat(formatOptions.secondaryYAxisLabel.secondaryYAxisMaxText);
27
- let margin;
28
- let yLabel;
29
- let xLabel;
30
- let yTitle;
31
- let xTitle;
32
- let dimensionHeightWidthArray;
33
- let chartTitleHeight;
34
- let secondaryAxisTitleWidth;
35
- let legendMargin;
36
- let secondaryYLabel;
37
- let maxNumberForPrimaryAxis;
38
- let maxNumberForSecondaryAxis;
39
- let innerWidth;
40
- let innerHeight;
41
- let width;
42
- let height;
43
- let dataTable;
44
- let dataTableHeight;
45
- let svg;
46
- let gTag;
47
- let yScale;
48
- let yScaleLegends;
49
- let xScaleBottom;
50
- let xScaleTop;
51
- let seriesLabels;
52
- let calculatedRange;
53
- let seriesLabelWidth;
54
- let xAxisBottom;
55
- let xAxisTop;
56
- let yAxis;
57
- let filteredDimension;
58
- let filteredData = [];
59
- let scrollPosition = 0;
60
- const visibleBars = 2;
61
- let chartJSON = {
62
- dimensionList: dimensionList,
63
- chartType: chartType,
64
- chartData: [],
65
- formatOptions: formatOptions,
66
- legendList: [],
67
- secondaryAxisDrawn: false,
68
- yMaxLeft: 0,
69
- yMaxRight: 0,
70
- yMinLeft: 0,
71
- yMinRight: 0,
72
- hideZeroValues: false,
73
- formattedDimensionListMap: new Map(),
74
- };
75
- //#region UseEffect
76
- useEffect(() => {
77
- try {
78
- createHorizontalBarChart();
79
- }
80
- catch (error) {
81
- logError("HorizontalBarchart", "createHorizontalBarChart", error);
82
- }
83
- }, [formatOptions]);
84
- //#endregion
85
- const createHorizontalBarChart = () => {
86
- ({ formatOptions, svg, width, height } = firstFunctionBeforeRender(svgRef, formatOptions));
87
- preProcessChartData(); // preaparing data related to chart creation
88
- // Applies custom Y-axis label formatting and calculates the necessary margin based on axis extremes.
89
- ({ maxNumberForPrimaryAxis, maxNumberForSecondaryAxis } =
90
- customYscaleLabelFormatting(
91
- // for calculating primary/secondary axis max number so that we can calculate margin accordinglt
92
- formatOptions, chartJSON.yMinLeft, chartJSON.yMaxLeft, chartJSON.yMinRight, chartJSON.yMaxRight));
93
- ({
94
- margin,
95
- yLabel,
96
- xLabel,
97
- yTitle,
98
- xTitle,
99
- dimensionHeightWidthArray,
100
- chartTitleHeight,
101
- secondaryAxisTitleWidth,
102
- legendMargin,
103
- secondaryYLabel,
104
- } = marginCalculation(
105
- // for all margin related calculations
106
- width, height, maxNumberForPrimaryAxis, maxNumberForSecondaryAxis, chartJSON.yMaxLeft, formatOptions, chartJSON.legendList, chartJSON.dimensionList, chartJSON.yMaxRight, isSecondaryAxisDrawn, isNormalizedChart, isDateType, barChart));
107
- setSVGContainer(margin); // for innerWidth/height static width/height
108
- ({ dataTable, dataTableHeight } = dataTablePreCalculation(
109
- // calculations for data tables
110
- formatOptions, yLabel, yTitle, seriesData, chartJSON.dimensionList));
111
- initSvg(
112
- // for svg creation
113
- svg, width, height, formatOptions);
114
- gTag = initChartArea(svg, margin); // creating chart area
115
- initPlotArea(gTag, formatOptions, dataTableHeight, innerWidth, innerHeight, chartType);
116
- initScale();
117
- initAxis();
118
- initYaxisBar(formatOptions, gTag, xLabel, innerHeight, innerWidth, yAxis, xAxisTop, xScaleBottom, chartJSON.yMaxLeft, filteredDimension, chartType, isDateType, width, dimensionHeightWidthArray, columnWidth);
119
- if (isSecondaryAxisDrawn) {
120
- initXaxisTop(formatOptions, gTag, secondaryYLabel, xAxisTop);
121
- }
122
- horizontalScrollBar(seriesData, height, svg, margin, innerWidth);
123
- if (formatOptions.dataTableProperties &&
124
- formatOptions.dataTableProperties.dataTable) {
125
- if (formatOptions.xAxisLabel.xAxisPosition != "1")
126
- formatOptions.xAxisLabel.xAxisLabelVisibility = false;
127
- addDataTable(formatOptions.plotArea.fitChart, svg, gTag, dataTable, columnWidth, xAxisBottom, yScale, yScaleLegends, undefined, undefined, dataTableHeight, chartType, formatOptions, yLabel, yTitle, chartJSON.dimensionList, innerWidth, calculatedRange, chartJSON.formattedDimensionListMap, chartId, margin, innerHeight);
128
- }
129
- setXaxistitle(formatOptions, barChart, svg, margin, xLabel, height, xTitle, chartJSON.chartType, yLabel, innerWidth, innerHeight);
130
- yAxistitle(innerHeight, formatOptions, dataTableHeight, barChart, svg, margin, yTitle, yLabel);
131
- yAxistitleRight(svg, isSecondaryAxisDrawn, margin, formatOptions, dataTableHeight, innerHeight, innerWidth, secondaryYLabel, secondaryAxisTitleWidth); // to be added later
132
- setChartTitle(svg, formatOptions, width, chartTitleHeight);
133
- drawLegends(height, svg, dimensionHeightWidthArray, chartTitleHeight, width, legendMargin, formatOptions, seriesData, chartId, staticLegendShape.rectangle);
134
- };
135
- const preProcessChartData = () => {
136
- const allChartData = [];
137
- const legendList = [];
138
- let formatedDimensionList = [];
139
- let yMaxLeft = -Infinity;
140
- let yMinLeft = Infinity;
141
- let yMaxRight = -Infinity;
142
- let yMinRight = Infinity;
143
- seriesData.forEach((series) => {
144
- legendList.push(series.legend);
145
- series.data.forEach((point) => {
146
- allChartData.push(point);
147
- if (series.properties.axis === "Secondary") {
148
- isSecondaryAxisDrawn = true;
149
- yMaxRight = Math.max(yMaxRight, point.value);
150
- yMinRight = Math.min(yMinRight, point.value);
151
- }
152
- else {
153
- yMaxLeft = Math.max(yMaxLeft, point.value);
154
- yMinLeft = Math.min(yMinLeft, point.value);
155
- }
156
- });
157
- });
158
- chartJSON.chartData = allChartData;
159
- chartJSON.legendList = legendList;
160
- chartJSON.yMaxLeft = yMaxLeft;
161
- chartJSON.yMinLeft = yMinLeft > 0 ? 0 : yMinLeft;
162
- chartJSON.yMaxRight = yMaxRight;
163
- chartJSON.yMinRight = yMinRight;
164
- // Apply formatted dimensions
165
- formatedDimensionList = isDateType
166
- ? setDateFormats(formatOptions.xAxisLabel.xAxisNumberFormat, chartJSON.dimensionList).map((d) => d)
167
- : chartJSON.dimensionList;
168
- chartJSON.dimensionList.forEach((dim, i) => {
169
- chartJSON.formattedDimensionListMap.set(dim, formatedDimensionList[i]);
170
- });
171
- filteredData = JSON.parse(JSON.stringify(seriesData));
172
- if (!formatOptions.plotArea.fitChart) {
173
- filteredDimension = chartJSON.dimensionList.slice(scrollPosition, scrollPosition + visibleBars);
174
- }
175
- else {
176
- filteredDimension = chartJSON.dimensionList;
177
- }
178
- if (formatOptions.plotArea.hideZeroValues) {
179
- chartJSON.hideZeroValues = true;
180
- }
181
- };
182
- const initScale = () => {
183
- // rounding the ymin & ymax
184
- let yAxisLabelArray = responsiveYaxisLabel(customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft, chartJSON.yMinLeft, innerHeight, formatOptions, chartJSON, customYaxisMinValue, customYaxisMaxValue).yAxisLabelArray;
185
- chartJSON.yMaxLeft = yAxisLabelArray[yAxisLabelArray.length - 1];
186
- chartJSON.yMinLeft = yAxisLabelArray[0];
187
- if (isPrimaryAxisDrawn) {
188
- xScaleBottom = d3
189
- .scaleLinear()
190
- .domain([
191
- chartJSON.yMinLeft >= 0 ?
192
- customYaxisMinValue !== undefined &&
193
- !Number.isNaN(customYaxisMinValue)
194
- ? customYaxisMinValue : 0
195
- : chartJSON.yMinLeft < 0
196
- ? chartJSON.yMinLeft * 1.1
197
- : chartJSON.yMinLeft * 0.9,
198
- chartJSON.yMaxLeft <= 0
199
- ? 0
200
- : customYaxisMaxValue !== undefined &&
201
- !Number.isNaN(customYaxisMaxValue)
202
- ? customYaxisMaxValue
203
- : chartJSON.yMaxLeft * 1.1,
204
- ])
205
- .range([0,
206
- dataTableHeight > 0 ? innerWidth - dataTableHeight : innerWidth
207
- ]);
208
- }
209
- if (isSecondaryAxisDrawn) {
210
- xScaleTop = d3
211
- .scaleLinear()
212
- .domain([
213
- chartJSON.yMinRight >= 0
214
- ? (secondaryCustomYaxisMinValue ||
215
- secondaryCustomYaxisMinValue == 0) &&
216
- !Number.isNaN(secondaryCustomYaxisMinValue)
217
- ? secondaryCustomYaxisMinValue
218
- : 0
219
- : (secondaryCustomYaxisMinValue ||
220
- secondaryCustomYaxisMinValue == 0) &&
221
- !Number.isNaN(secondaryCustomYaxisMinValue)
222
- ? secondaryCustomYaxisMinValue
223
- : chartJSON.yMinRight * 1.1,
224
- chartJSON.yMaxRight <= 0
225
- ? secondaryCustomYaxisMaxValue
226
- ? secondaryCustomYaxisMaxValue
227
- : 0
228
- : secondaryCustomYaxisMaxValue
229
- ? secondaryCustomYaxisMaxValue
230
- : chartJSON.yMaxRight * 1.1,
231
- ])
232
- .range([0,
233
- dataTableHeight > 0 ? innerWidth - dataTableHeight : innerWidth
234
- ]);
235
- }
236
- calculatedRange = [innerHeight, 0];
237
- if (formatOptions.seriesLabel.seriesLabelVisibility) {
238
- let labelObj = prepareDataForSeriesLabel(innerWidth, xScaleBottom, formatOptions, filteredData, xScaleTop, isSecondaryAxisDrawn);
239
- seriesLabels = labelObj.labelArray;
240
- formatOptions.seriesLabel.seriesLabelPosition == "Right" &&
241
- (seriesLabelWidth = labelObj.heightWidth[0]);
242
- formatOptions.seriesLabel.seriesLabelPosition == "Right"
243
- ? (calculatedRange = [0, innerHeight - labelObj.heightWidth[0]])
244
- : (calculatedRange = [labelObj.heightWidth[0], innerHeight]);
245
- }
246
- getYScale();
247
- };
248
- const getYScale = () => {
249
- columnWidth =
250
- (0.51 +
251
- (0.61 * (100 - parseFloat(formatOptions.plotArea.plotAreaGapWidth))) /
252
- 100) *
253
- (innerHeight / filteredDimension.length);
254
- yScaleLegends = d3
255
- .scaleBand()
256
- // .domain(barLegendList.map((d) => d.legend))
257
- .domain(chartJSON.legendList)
258
- .range([0, columnWidth])
259
- .paddingInner(chartJSON.legendList.length > 1
260
- ? (0.3 * parseFloat(formatOptions.plotArea.plotAreaSeriesWidth)) / 100
261
- : 0);
262
- yScale = d3
263
- .scalePoint()
264
- .domain(filteredDimension)
265
- .range(calculatedRange)
266
- .padding(0.5);
267
- };
268
- const initAxis = () => {
269
- getYAxis();
270
- if (isPrimaryAxisDrawn) {
271
- xAxisBottom = d3
272
- .axisBottom(xScaleBottom)
273
- .tickFormat((d) => getNumberWithFormat(d, formatOptions.yAxisLabel.yAxisDisplayUnits, formatOptions.yAxisLabel.yAxisNumberFormat, formatOptions.yAxisLabel.yAxisLabelDecimalPrecision))
274
- .tickSize(formatOptions.plotArea.gridLinesVisibility
275
- ? formatOptions.plotArea.gridLinesHorizontal
276
- ? -innerHeight + (seriesLabelWidth ? seriesLabelWidth : 0)
277
- : 0
278
- : 0)
279
- .tickValues(responsiveYaxisLabel(customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft, chartJSON.yMinLeft, innerHeight, formatOptions, chartJSON, customYaxisMinValue, customYaxisMaxValue).yAxisLabelArray)
280
- .ticks(responsiveYaxisLabel(customYaxisMaxValue ? customYaxisMaxValue : chartJSON.yMaxLeft, chartJSON.yMinLeft, innerHeight, formatOptions, chartJSON, customYaxisMinValue, customYaxisMaxValue).customTickValue ??
281
- (dataTableHeight > 0
282
- ? (innerHeight - dataTableHeight) / 30
283
- : innerHeight / 30))
284
- .tickSizeOuter(0);
285
- }
286
- if (isSecondaryAxisDrawn) {
287
- xAxisTop = d3
288
- .axisTop(xScaleTop)
289
- .tickFormat((d) => getNumberWithFormat(d, formatOptions.secondaryYAxisLabel.secondaryYAxisDisplayUnits, formatOptions.secondaryYAxisLabel.secondaryYAxisNumberFormat, formatOptions.secondaryYAxisLabel
290
- .secondaryYAxisLabelDecimalPrecision))
291
- .tickValues(responsiveSecondaryYaxisLabel(secondaryCustomYaxisMaxValue
292
- ? secondaryCustomYaxisMaxValue
293
- : chartJSON.yMaxRight, chartJSON.yMinRight, formatOptions, chartJSON).secondaryYAxisLabelArray)
294
- .ticks(responsiveSecondaryYaxisLabel(secondaryCustomYaxisMaxValue
295
- ? secondaryCustomYaxisMaxValue
296
- : chartJSON.yMaxRight, chartJSON.yMinRight, formatOptions, chartJSON).secondaryCustomTickValue ?? innerHeight / 30)
297
- .tickSize(formatOptions.plotArea.gridLinesVisibility
298
- ? formatOptions.plotArea.gridLinesHorizontal
299
- ? -innerWidth
300
- : 0
301
- : 0)
302
- .tickSizeOuter(0);
303
- }
304
- };
305
- const getYAxis = () => {
306
- yAxis = d3
307
- .axisLeft(yScale)
308
- .tickSize(formatOptions.plotArea.gridLinesVisibility
309
- ? formatOptions.plotArea.gridLinesVertical
310
- ? formatOptions.plotArea.gridLinesVertical
311
- ? -(dataTableHeight > 0
312
- ? innerHeight - dataTableHeight
313
- : innerHeight)
314
- : parseFloat(formatOptions.plotArea.ticksHeight) *
315
- ((dataTableHeight > 0
316
- ? innerHeight - dataTableHeight
317
- : innerHeight) /
318
- 100) *
319
- (formatOptions.xAxisLabel.xAxisPosition == "1" ? 1 : -1)
320
- : 0
321
- : 0)
322
- .tickSizeOuter(0)
323
- .tickValues(responsiveXaxisLabel(filteredDimension, innerHeight));
324
- };
325
- const getChartType = (lineData) => {
326
- lineData.forEach((lData) => {
327
- lData.data.forEach((cData) => {
328
- cData.hideZero = lData.properties.hideZeroValues;
329
- cData.axis = lData.properties.axis;
330
- });
331
- });
332
- // Bind dummy data to ensure a single group is created
333
- lineData.forEach((data) => {
334
- // Step 1: Outer group for the whole chart
335
- let column = gTag.selectAll(".parentGroup").data([data], (d) => d.legend); // use key so exit works
336
- column = column
337
- .enter()
338
- .append("g")
339
- .attr("class", `column parentGroup`)
340
- .merge(column);
341
- // Step 2: JOIN each data point inside the series
342
- let columnGroups = column
343
- .selectAll(".column-group")
344
- .data(data.data, (d) => d.legend + d.dimension); // key on dimension + legend
345
- // Step 3: ENTER - one group per bar (optional if you need transform)
346
- let columnGroupsEnter = columnGroups
347
- .enter()
348
- .append("g")
349
- .attr("class", "column-group")
350
- .attr("hoverId", (d) => d.legend.includes("-")
351
- ? d.legend.replace("-", "`").split("`")[1].replace(/ /g, "-")
352
- : d.legend.replace(/ /g, "-"))
353
- .attr("transform", (d) => `translate(0, ${yScale(d.dimension) - columnWidth / 2})`);
354
- // ✨ Add this to handle UPDATE:
355
- columnGroups.attr("transform", (d) => `translate(0, ${yScale(d.dimension) - columnWidth / 2})`);
356
- // Merge ENTER + UPDATE
357
- columnGroupsEnter
358
- .merge(columnGroups)
359
- .attr("transform", (d) => `translate(0, ${yScale(d.dimension) - columnWidth / 2})`);
360
- // Step 4: Draw the rects
361
- columnGroupsEnter
362
- .append("rect")
363
- .attr("y", (d) => yScaleLegends(d.legend))
364
- .attr("height", yScaleLegends.bandwidth())
365
- .attr("x", (d) => {
366
- const requiredXScale = (data.properties.axis === "Primary") ? xScaleBottom : xScaleTop;
367
- return d.value > 0 ? requiredXScale(0) : requiredXScale(d.value);
368
- })
369
- .attr("width", (d) => {
370
- const requiredXScale = (data.properties.axis === "Primary") ? xScaleBottom : xScaleTop;
371
- const requiredCustomValue = (data.properties.axis === "Primary") ? customYaxisMaxValue : secondaryCustomYaxisMaxValue;
372
- return d.value > 0
373
- ? requiredCustomValue && d.value > requiredCustomValue
374
- ? requiredXScale(requiredCustomValue) - requiredXScale(0) : requiredXScale(d.value) - requiredXScale(0) :
375
- Math.abs(requiredXScale(0) - requiredXScale(d.value));
376
- })
377
- .attr("fill", data.properties.color)
378
- .attr("stroke-dasharray", (d) => d.stackBorderStyle === 2 ? "5,3" : "0")
379
- .attr("stroke-width", (d) => `${d.stackBorderWidth}px`)
380
- .attr("stroke", (d) => data.properties.stackBorderStyle === 0
381
- ? "none"
382
- : formatOptions.column.stackBorderVisibility
383
- ? data.properties.stackBorderStyle
384
- : "none")
385
- .style("clip-path", "inset(0px) fill-box")
386
- .style("shape-rendering", "crispEdges")
387
- .attr("visibility", (d) => d.value === 0 && formatOptions.xAxisLabel.hideZeroValues
388
- ? "hidden"
389
- : "visible")
390
- .on("mousemove", (event, d) => {
391
- showTooltipOnMouseMove([
392
- {
393
- key: formatOptions.xAxisTitle.xAxisTitleText.includes("~$~")
394
- ? formatOptions.xAxisTitle.xAxisTitleText.split("~$~")[1]
395
- : formatOptions.xAxisTitle.xAxisTitleText,
396
- value: chartJSON.formattedDimensionListMap.get(Array.isArray(d.dimension) ? d.dimension[0] : d.dimension),
397
- },
398
- {
399
- key: formatOptions.yAxisTitle.yAxisTitleText || d.value,
400
- value: getNumberWithFormat([
401
- actualChartTypes.stackLine100,
402
- actualChartTypes.stackArea100,
403
- "",
404
- ].includes(chartType)
405
- ? d[1] - d[0]
406
- : d.value, formatOptions.toolTip.toolTipDisplayUnits, formatOptions.toolTip.toolTipNumberFormat, formatOptions.toolTip.toolTipDecimalPrecision),
407
- },
408
- {
409
- key: "Legend",
410
- value: d.legend.includes("~$~")
411
- ? d.legend.split("~$~")[1]
412
- : d.legend,
413
- },
414
- ], formatOptions, event);
415
- })
416
- .on("mouseout", hideTooltipOnMouseOut);
417
- // Step 5: EXIT - remove old bars
418
- columnGroups
419
- .exit()
420
- .remove();
421
- });
422
- };
423
- const setSVGContainer = (margin) => {
424
- innerWidth = width - margin.left - margin.right;
425
- innerHeight = height - margin.bottom - margin.top;
426
- };
427
- const horizontalScrollBar = (seriesData, height, svg, margin, innerWidth) => {
428
- if (!formatOptions.plotArea.fitChart) {
429
- // Scrollbar parameters
430
- const scrollMax = seriesData[0].data.length - visibleBars;
431
- // Scrollbar track & handle
432
- const scrollbarY = height - 20;
433
- filteredDimension = chartJSON.dimensionList.slice(scrollPosition, scrollPosition + visibleBars);
434
- getYScale();
435
- filteredData = JSON.parse(JSON.stringify(seriesData));
436
- filteredData.forEach((data, i) => (filteredData[i].data = data.data.filter((d) => filteredDimension.includes(d.dimension))));
437
- getYAxis();
438
- svg
439
- .append("rect")
440
- .attr("x", margin.left)
441
- .attr("y", scrollbarY)
442
- .attr("width", innerWidth)
443
- .attr("height", 8)
444
- .attr("fill", "#ddd")
445
- .attr("rx", 4);
446
- const handleWidth = (innerWidth * visibleBars) / chartJSON.dimensionList.length;
447
- const handle = svg
448
- .append("rect")
449
- .attr("x", margin.left)
450
- .attr("y", scrollbarY)
451
- .attr("width", handleWidth)
452
- .attr("height", 8)
453
- .attr("fill", "#999")
454
- .attr("rx", 4)
455
- .style("cursor", "ew-resize")
456
- .call(d3.drag().on("drag", (event) => {
457
- let x = Math.min(Math.max(event.x, margin.left), margin.left + innerWidth - handleWidth);
458
- handle.attr("x", x);
459
- scrollPosition = Math.round(((x - margin.left) / (innerWidth - handleWidth)) * scrollMax);
460
- filteredDimension = chartJSON.dimensionList.slice(scrollPosition, scrollPosition + visibleBars);
461
- getYScale();
462
- filteredData = JSON.parse(JSON.stringify(seriesData));
463
- filteredData.forEach((data, i) => (filteredData[i].data = data.data.filter((d) => filteredDimension.includes(d.dimension))));
464
- getYAxis();
465
- drawColumnChart();
466
- }));
467
- svg.on("wheel", (event) => {
468
- event.preventDefault();
469
- const scrollDelta = Math.abs(event.deltaX) > Math.abs(event.deltaY)
470
- ? event.deltaX
471
- : event.deltaY;
472
- scrollPosition += scrollDelta > 0 ? 1 : -1;
473
- scrollPosition = Math.max(0, Math.min(scrollPosition, scrollMax));
474
- const x = margin.left +
475
- ((innerWidth - handleWidth) * scrollPosition) / scrollMax;
476
- handle.attr("x", x);
477
- getYScale();
478
- filteredData = JSON.parse(JSON.stringify(seriesData));
479
- filteredData.forEach((data, i) => (filteredData[i].data = data.data.filter((d) => filteredDimension.includes(d.dimension))));
480
- getYAxis();
481
- drawColumnChart();
482
- });
483
- }
484
- drawColumnChart();
485
- };
486
- const drawColumnChart = () => {
487
- getChartType(filteredData);
488
- initXaxisBar(formatOptions, gTag, yLabel, innerHeight, innerWidth, xAxisBottom);
489
- commonAnnotations(filteredData, yScale, xScaleBottom, xScaleTop, // need to pass secondary axis scale if secondary axis is drawn
490
- margin, d3Annotation, [], //this.labelExcludeList,
491
- [], //this.individualLabelColor,
492
- [], //this.attributes.Id ? formatOptions.plotArea.dataLabelsCoordinates : this.parentReference.objService.tempAnnotationArray
493
- formatOptions, chartType, height, width, innerWidth, filteredDimension, innerHeight, chartId, svg, yScaleLegends, columnWidth, false, barChart);
494
- };
495
- return (_jsxs("div", { style: { width: "100%", height: "100%" }, children: [_jsx("div", { id: "chartTooltipDiv" }), _jsx("svg", { className: "chartSVG", ref: svgRef, id: chartId, style: { width: "100%", height: "100%" } })] }));
496
- };
497
- export default HorizontalHistogramChart; // Exporting with a different name for consistency
@@ -1,4 +0,0 @@
1
- import React from "react";
2
- import { type TChartProps } from "../ChartsWithAxisTypes.types";
3
- declare const LayeredColumnChart: React.FC<TChartProps>;
4
- export default LayeredColumnChart;