@cdc/chart 4.23.4 → 4.23.6

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 (42) hide show
  1. package/dist/cdcchart.js +54845 -51755
  2. package/examples/feature/__data__/planet-example-data.json +14 -32
  3. package/examples/feature/__data__/planet-logaritmic-data.json +56 -0
  4. package/examples/feature/area/area-chart-category.json +240 -0
  5. package/examples/feature/bar/example-bar-chart.json +544 -22
  6. package/examples/feature/bar/new.json +561 -0
  7. package/examples/feature/bar/planet-chart-logaritmic-config.json +170 -0
  8. package/examples/feature/boxplot/valid-boxplot.csv +17 -0
  9. package/examples/feature/combo/right-issues.json +190 -0
  10. package/examples/feature/filters/filter-testing.json +37 -3
  11. package/examples/feature/forecasting/combo-forecasting.json +245 -0
  12. package/examples/feature/forecasting/forecasting.json +5325 -0
  13. package/examples/feature/forecasting/index.json +203 -0
  14. package/examples/feature/forecasting/random_data.csv +366 -0
  15. package/examples/feature/line/line-chart.json +3 -3
  16. package/examples/feature/test-highlight/test-highlight-2.json +789 -0
  17. package/examples/feature/test-highlight/test-highlight-vertical.json +561 -0
  18. package/examples/feature/test-highlight/test-highlight.json +100 -0
  19. package/examples/feature/tests-non-numerics/stacked-vertical-bar-example-nonnumerics.json +1 -2
  20. package/examples/gallery/bar-chart-horizontal/horizontal-highlight.json +345 -0
  21. package/examples/gallery/line/line.json +173 -1
  22. package/index.html +14 -8
  23. package/package.json +2 -2
  24. package/src/CdcChart.jsx +342 -25
  25. package/src/components/AreaChart.jsx +32 -40
  26. package/src/components/BarChart.jsx +147 -25
  27. package/src/components/DataTable.jsx +30 -12
  28. package/src/components/DeviationBar.jsx +32 -32
  29. package/src/components/EditorPanel.jsx +1902 -1126
  30. package/src/components/Forecasting.jsx +147 -0
  31. package/src/components/Legend.jsx +193 -243
  32. package/src/components/LineChart.jsx +4 -9
  33. package/src/components/LinearChart.jsx +263 -285
  34. package/src/components/Series.jsx +518 -0
  35. package/src/components/SparkLine.jsx +3 -3
  36. package/src/data/initial-state.js +24 -5
  37. package/src/hooks/useHighlightedBars.js +154 -0
  38. package/src/hooks/useMinMax.js +128 -0
  39. package/src/hooks/useReduceData.js +31 -57
  40. package/src/hooks/useRightAxis.js +8 -2
  41. package/src/hooks/useScales.js +196 -0
  42. /package/examples/feature/area/{area-chart.json → area-chart-date.json} +0 -0
@@ -0,0 +1,245 @@
1
+ {
2
+ "type": "chart",
3
+ "title": "Forecasting Chart Example",
4
+ "showTitle": true,
5
+ "theme": "theme-blue",
6
+ "animate": true,
7
+ "fontSize": "medium",
8
+ "lineDatapointStyle": "hover",
9
+ "barHasBorder": "false",
10
+ "isLollipopChart": false,
11
+ "lollipopShape": "circle",
12
+ "lollipopColorStyle": "two-tone",
13
+ "visualizationSubType": "regular",
14
+ "barStyle": "",
15
+ "roundingStyle": "standard",
16
+ "tipRounding": "top",
17
+ "padding": {
18
+ "left": 0,
19
+ "right": 0
20
+ },
21
+ "yAxis": {
22
+ "hideAxis": false,
23
+ "displayNumbersOnBar": false,
24
+ "hideLabel": false,
25
+ "hideTicks": false,
26
+ "size": "75",
27
+ "gridLines": false,
28
+ "enablePadding": false,
29
+ "min": "0",
30
+ "max": "900",
31
+ "labelColor": "#333",
32
+ "tickLabelColor": "#333",
33
+ "tickColor": "#333",
34
+ "rightHideAxis": false,
35
+ "rightAxisSize": 50,
36
+ "rightLabel": "",
37
+ "rightLabelOffsetSize": 0,
38
+ "rightAxisLabelColor": "#333",
39
+ "rightAxisTickLabelColor": "#333",
40
+ "rightAxisTickColor": "#333",
41
+ "numTicks": "",
42
+ "axisPadding": 0,
43
+ "tickRotation": 0,
44
+ "anchors": [],
45
+ "label": "Cases by Date of Report"
46
+ },
47
+ "boxplot": {
48
+ "plots": [],
49
+ "borders": "true",
50
+ "firstQuartilePercentage": 25,
51
+ "thirdQuartilePercentage": 75,
52
+ "boxWidthPercentage": 40,
53
+ "plotOutlierValues": false,
54
+ "plotNonOutlierValues": true,
55
+ "legend": {
56
+ "showHowToReadText": false,
57
+ "howToReadText": ""
58
+ },
59
+ "labels": {
60
+ "q1": "Lower Quartile",
61
+ "q2": "q2",
62
+ "q3": "Upper Quartile",
63
+ "q4": "q4",
64
+ "minimum": "Minimum",
65
+ "maximum": "Maximum",
66
+ "mean": "Mean",
67
+ "median": "Median",
68
+ "sd": "Standard Deviation",
69
+ "iqr": "Interquartile Range",
70
+ "count": "Count",
71
+ "outliers": "Outliers",
72
+ "values": "Values"
73
+ }
74
+ },
75
+ "topAxis": {
76
+ "hasLine": true
77
+ },
78
+ "isLegendValue": false,
79
+ "barThickness": 0.35,
80
+ "barHeight": 25,
81
+ "barSpace": 15,
82
+ "heights": {
83
+ "vertical": 300,
84
+ "horizontal": 750
85
+ },
86
+ "xAxis": {
87
+ "type": "date",
88
+ "showTargetLabel": true,
89
+ "targetLabel": "Target",
90
+ "hideAxis": false,
91
+ "hideLabel": false,
92
+ "hideTicks": false,
93
+ "size": 75,
94
+ "tickRotation": 30,
95
+ "min": "",
96
+ "max": "",
97
+ "labelColor": "#333",
98
+ "tickLabelColor": "#333",
99
+ "tickColor": "#333",
100
+ "numTicks": "",
101
+ "labelOffset": 65,
102
+ "axisPadding": 0,
103
+ "target": 0,
104
+ "anchors": [
105
+ {
106
+ "value": "10/19/2022",
107
+ "lineStyle": "dashed-md"
108
+ }
109
+ ],
110
+ "label": "",
111
+ "dataKey": "date",
112
+ "dateParseFormat": "%m/%d/%Y",
113
+ "dateDisplayFormat": "%m/%d/%Y"
114
+ },
115
+ "table": {
116
+ "label": "Data Table",
117
+ "expanded": false,
118
+ "limitHeight": false,
119
+ "height": "",
120
+ "caption": "",
121
+ "showDownloadUrl": false,
122
+ "showDataTableLink": true,
123
+ "show": true
124
+ },
125
+ "orientation": "vertical",
126
+ "legend": {
127
+ "behavior": "isolate",
128
+ "singleRow": false,
129
+ "colorCode": "",
130
+ "reverseLabelOrder": false,
131
+ "description": "",
132
+ "dynamicLegend": false,
133
+ "dynamicLegendDefaultText": "Show All",
134
+ "dynamicLegendItemLimit": 5,
135
+ "dynamicLegendItemLimitMessage": "Dynamic Legend Item Limit Hit.",
136
+ "dynamicLegendChartMessage": "Select Options from the Legend",
137
+ "position": "right",
138
+ "hide": false
139
+ },
140
+ "exclusions": {
141
+ "active": false,
142
+ "keys": []
143
+ },
144
+ "palette": "sequential-bluereverse",
145
+ "isPaletteReversed": true,
146
+ "twoColor": {
147
+ "palette": "monochrome-1",
148
+ "isPaletteReversed": false
149
+ },
150
+ "labels": false,
151
+ "dataFormat": {
152
+ "commas": false,
153
+ "prefix": "",
154
+ "suffix": "",
155
+ "abbreviated": false,
156
+ "bottomSuffix": "",
157
+ "bottomPrefix": "",
158
+ "bottomAbbreviated": false,
159
+ "roundTo": "0"
160
+ },
161
+ "confidenceKeys": {},
162
+ "visual": {
163
+ "border": true,
164
+ "accent": true,
165
+ "background": true
166
+ },
167
+ "filterBehavior": "Filter Change",
168
+ "forecastingChart": {
169
+ "showBars": false,
170
+ "barColumn": "confirm",
171
+ "barColor": "#918e90",
172
+ "confidenceIntervals": [
173
+ {
174
+ "low": "lower_20",
175
+ "high": "upper_20"
176
+ },
177
+ {
178
+ "low": "lower_50",
179
+ "high": "upper_50"
180
+ },
181
+ {
182
+ "low": "lower_90",
183
+ "high": "upper_90"
184
+ },
185
+ {}
186
+ ],
187
+ "stages": "type",
188
+ "colors": [
189
+ "sequential-greenreverse",
190
+ "sequential-orange-(MPX)reverse",
191
+ "sequential-blue-2-(MPX)reverse"
192
+ ],
193
+ "groups": [
194
+ "estimate",
195
+ "estimate based on partial data",
196
+ "forecast"
197
+ ],
198
+ "showBarColumn": true
199
+ },
200
+ "dataUrl": "./examples/feature/forecasting/case_date_example.csv",
201
+ "animateReplay": true,
202
+ "visualizationType": "Combo",
203
+ "series": [
204
+ {
205
+ "dataKey": "confirm",
206
+ "type": "Bar",
207
+ "axis": "Left"
208
+ },
209
+ {
210
+ "dataKey": "type",
211
+ "type": "Forecasting",
212
+ "axis": "Left",
213
+ "confidenceIntervals": [
214
+ {
215
+ "high": "upper_90",
216
+ "low": "lower_90"
217
+ },
218
+ {
219
+ "high": "upper_50",
220
+ "low": "lower_50"
221
+ },
222
+ {
223
+ "high": "upper_20",
224
+ "low": "lower_20"
225
+ }
226
+ ],
227
+ "stageColumn": "type",
228
+ "stageItem": "estimate",
229
+ "stages": [
230
+ {
231
+ "key": "estimate",
232
+ "color": "sequential-green"
233
+ },
234
+ {
235
+ "key": "estimate based on partial data",
236
+ "color": "sequential-orange-(MPX)"
237
+ },
238
+ {
239
+ "key": "forecast",
240
+ "color": "sequential-blue"
241
+ }
242
+ ]
243
+ }
244
+ ]
245
+ }