@cdc/chart 1.3.4 → 4.22.10

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 (50) hide show
  1. package/LICENSE +201 -0
  2. package/dist/cdcchart.js +6 -6
  3. package/examples/cutoff-example-config.json +2 -0
  4. package/examples/cutoff-example-data.json +1 -1
  5. package/examples/dynamic-legends.json +125 -0
  6. package/examples/gallery/bar-chart-horizontal/horizontal-bar-chart-with-numbers-on-bar.json +198 -0
  7. package/examples/gallery/bar-chart-horizontal/horizontal-bar-chart.json +241 -0
  8. package/examples/gallery/bar-chart-horizontal/horizontal-stacked.json +248 -0
  9. package/examples/gallery/bar-chart-vertical/combo-line-chart.json +137 -0
  10. package/examples/gallery/bar-chart-vertical/vertical-bar-chart-categorical.json +80 -0
  11. package/examples/gallery/bar-chart-vertical/vertical-bar-chart-stacked.json +81 -0
  12. package/examples/gallery/bar-chart-vertical/vertical-bar-chart-with-confidence.json +68 -0
  13. package/examples/gallery/bar-chart-vertical/vertical-bar-chart.json +111 -0
  14. package/examples/gallery/lollipop/lollipop-style-horizontal.json +220 -0
  15. package/examples/gallery/paired-bar/paired-bar-chart.json +196 -0
  16. package/examples/horizontal-chart.json +3 -0
  17. package/examples/paired-bar-data.json +1 -1
  18. package/examples/paired-bar-example.json +2 -0
  19. package/examples/planet-combo-example-config.json +2 -0
  20. package/examples/planet-example-config.json +2 -2
  21. package/examples/planet-example-data.json +1 -1
  22. package/examples/planet-pie-example-config.json +2 -0
  23. package/examples/private/line-test-data.json +22 -0
  24. package/examples/private/line-test-two.json +216 -0
  25. package/examples/private/line-test.json +102 -0
  26. package/examples/private/shawn.json +1296 -0
  27. package/examples/private/yaxis-test.json +132 -0
  28. package/examples/private/yaxis-testing.csv +27 -0
  29. package/examples/private/yaxis.json +28 -0
  30. package/examples/stacked-vertical-bar-example.json +228 -0
  31. package/package.json +2 -2
  32. package/src/CdcChart.tsx +121 -168
  33. package/src/components/BarChart.tsx +92 -40
  34. package/src/components/DataTable.tsx +28 -13
  35. package/src/components/EditorPanel.js +286 -182
  36. package/src/components/Legend.js +334 -0
  37. package/src/components/LineChart.tsx +57 -17
  38. package/src/components/LinearChart.tsx +171 -77
  39. package/src/components/PairedBarChart.tsx +139 -42
  40. package/src/components/PieChart.tsx +33 -6
  41. package/src/components/SparkLine.js +28 -27
  42. package/src/components/useIntersectionObserver.tsx +30 -0
  43. package/src/data/initial-state.js +23 -7
  44. package/src/hooks/useChartClasses.js +35 -0
  45. package/src/hooks/useLegendClasses.js +20 -0
  46. package/src/hooks/useReduceData.ts +72 -24
  47. package/src/index.html +29 -30
  48. package/src/scss/editor-panel.scss +34 -4
  49. package/src/scss/main.scss +201 -5
  50. package/src/components/BarStackVertical.js +0 -0
package/examples/private/line-test-two.json ADDED
@@ -0,0 +1,216 @@
1
+ {
2
+ "type": "chart",
3
+ "title": "Planet Radius (Bar Example)",
4
+ "theme": "theme-blue",
5
+ "fontSize": "medium",
6
+ "lineDatapointStyle": "always show",
7
+ "barHasBorder": "false",
8
+ "isLollipopChart": false,
9
+ "lollipopShape": "circle",
10
+ "lollipopColorStyle": "two-tone",
11
+ "visualizationSubType": "stacked",
12
+ "barStyle": "",
13
+ "roundingStyle": "standard",
14
+ "tipRounding": "top",
15
+ "padding": {
16
+ "left": 5,
17
+ "right": 5
18
+ },
19
+ "yAxis": {
20
+ "hideAxis": false,
21
+ "displayNumbersOnBar": false,
22
+ "hideLabel": false,
23
+ "hideTicks": false,
24
+ "size": 50,
25
+ "gridLines": false,
26
+ "min": "",
27
+ "max": "",
28
+ "type": "chart",
29
+ "title": "Planet Radius (Bar Example)",
30
+ "theme": "theme-blue",
31
+ "fontSize": "medium",
32
+ "lineDatapointStyle": "always show",
33
+ "barHasBorder": "false",
34
+ "isLollipopChart": false,
35
+ "lollipopShape": "circle",
36
+ "lollipopColorStyle": "two-tone",
37
+ "visualizationSubType": "stacked",
38
+ "barStyle": "",
39
+ "roundingStyle": "standard",
40
+ "tipRounding": "top",
41
+ "padding": {
42
+ "left": 5,
43
+ "right": 5
44
+ },
45
+ "yAxis": {
46
+ "hideAxis": false,
47
+ "displayNumbersOnBar": false,
48
+ "hideLabel": false,
49
+ "hideTicks": false,
50
+ "size": 50,
51
+ "gridLines": false,
52
+ "min": "",
53
+ "max": "",
54
+ "label": "Measurement (1000km)"
55
+ },
56
+ "barThickness": 0.35,
57
+ "barHeight": 25,
58
+ "height": 585,
59
+ "xAxis": {
60
+ "type": "categorical",
61
+ "hideAxis": false,
62
+ "hideLabel": false,
63
+ "hideTicks": false,
64
+ "size": 75,
65
+ "tickRotation": 30,
66
+ "min": "",
67
+ "max": "",
68
+ "label": "Planet",
69
+ "dataKey": "name"
70
+ },
71
+ "table": {
72
+ "label": "Data Table",
73
+ "expanded": false,
74
+ "show": true
75
+ },
76
+ "orientation": "horizontal",
77
+ "legend": {
78
+ "behavior": "isolate",
79
+ "position": "right",
80
+ "reverseLabelOrder": false,
81
+ "hide": false
82
+ },
83
+ "exclusions": {
84
+ "active": false,
85
+ "keys": []
86
+ },
87
+ "palette": "qualitative-bold",
88
+ "isPaletteReversed": false,
89
+ "labels": false,
90
+ "dataFormat": {
91
+ "commas": false,
92
+ "prefix": "",
93
+ "suffix": "km",
94
+ "roundTo": 1
95
+ },
96
+ "confidenceKeys": {},
97
+ "dataUrl": "/examples/planet-example-data.json",
98
+ "visualizationType": "Bar",
99
+ "series": [
100
+ {
101
+ "dataKey": "Radius"
102
+ },
103
+ {
104
+ "dataKey": "Diameter"
105
+ }
106
+ ],
107
+ "dataCutoff": "0.5",
108
+ "runtime": {
109
+ "seriesLabels": {
110
+ "Radius": "Radius",
111
+ "Diameter": "Diameter"
112
+ },
113
+ "seriesLabelsAll": [
114
+ "Radius",
115
+ "Diameter"
116
+ ],
117
+ "originalXAxis": {
118
+ "type": "categorical",
119
+ "hideAxis": false,
120
+ "hideLabel": false,
121
+ "hideTicks": false,
122
+ "size": 75,
123
+ "tickRotation": 30,
124
+ "min": "",
125
+ "max": "",
126
+ "label": "Planet",
127
+ "dataKey": "name"
128
+ },
129
+ "seriesKeys": [
130
+ "Radius",
131
+ "Diameter"
132
+ ],
133
+ "xAxis": {
134
+ "hideAxis": false,
135
+ "displayNumbersOnBar": false,
136
+ "hideLabel": false,
137
+ "hideTicks": false,
138
+ "size": 50,
139
+ "gridLines": false,
140
+ "min": "",
141
+ "max": "",
142
+ "label": "Measurement (1000km)"
143
+ },
144
+ "yAxis": {
145
+ "type": "categorical",
146
+ "hideAxis": false,
147
+ "hideLabel": false,
148
+ "hideTicks": false,
149
+ "size": 75,
150
+ "tickRotation": 30,
151
+ "min": "",
152
+ "max": "",
153
+ "label": "Planet",
154
+ "dataKey": "name"
155
+ },
156
+ "horizontal": true,
157
+ "uniqueId": 1663785202233,
158
+ "editorErrorMessage": ""
159
+ },
160
+ "barPadding": 40,
161
+ "labelPlacement": "Below Bar"
162
+ },
163
+ "barThickness": 0.35,
164
+ "barHeight": 25,
165
+ "height": 585,
166
+ "xAxis": {
167
+ "type": "categorical",
168
+ "hideAxis": false,
169
+ "hideLabel": false,
170
+ "hideTicks": false,
171
+ "size": 75,
172
+ "tickRotation": 30,
173
+ "min": "",
174
+ "max": "",
175
+ "label": "Planet",
176
+ "dataKey": "name"
177
+ },
178
+ "table": {
179
+ "label": "Data Table",
180
+ "expanded": false,
181
+ "show": true
182
+ },
183
+ "orientation": "horizontal",
184
+ "legend": {
185
+ "behavior": "isolate",
186
+ "position": "right",
187
+ "reverseLabelOrder": false,
188
+ "hide": false
189
+ },
190
+ "exclusions": {
191
+ "active": false,
192
+ "keys": []
193
+ },
194
+ "palette": "qualitative-bold",
195
+ "isPaletteReversed": false,
196
+ "labels": false,
197
+ "dataFormat": {
198
+ "commas": false,
199
+ "prefix": "",
200
+ "suffix": "km",
201
+ "roundTo": 1
202
+ },
203
+ "confidenceKeys": {},
204
+ "dataUrl": "/examples/planet-example-data.json",
205
+ "visualizationType": "Line",
206
+ "series": [
207
+ {
208
+ "dataKey": "Radius"
209
+ },
210
+ {
211
+ "dataKey": "Diameter"
212
+ }
213
+ ],
214
+ "dataCutoff": "0.5",
215
+ "barPadding": 40
216
+ }
package/examples/private/line-test.json ADDED
@@ -0,0 +1,102 @@
1
+ {
2
+ "type": "chart",
3
+ "title": "",
4
+ "theme": "theme-blue",
5
+ "fontSize": "medium",
6
+ "lineDatapointStyle": "hover",
7
+ "barHasBorder": "false",
8
+ "isLollipopChart": false,
9
+ "lollipopShape": "circle",
10
+ "lollipopColorStyle": "two-tone",
11
+ "visualizationSubType": "regular",
12
+ "barStyle": "",
13
+ "roundingStyle": "standard",
14
+ "tipRounding": "top",
15
+ "padding": {
16
+ "left": 5,
17
+ "right": 5
18
+ },
19
+ "yAxis": {
20
+ "hideAxis": false,
21
+ "displayNumbersOnBar": false,
22
+ "hideLabel": false,
23
+ "hideTicks": false,
24
+ "size": 50,
25
+ "gridLines": false,
26
+ "min": "",
27
+ "max": "",
28
+ "label": "Number"
29
+ },
30
+ "barThickness": 0.35,
31
+ "barHeight": 25,
32
+ "height": 300,
33
+ "xAxis": {
34
+ "type": "date",
35
+ "hideAxis": false,
36
+ "hideLabel": false,
37
+ "hideTicks": false,
38
+ "size": 75,
39
+ "tickRotation": 0,
40
+ "min": "",
41
+ "max": "",
42
+ "dataKey": "Date",
43
+ "dateParseFormat": "%m/%d/%Y",
44
+ "dateDisplayFormat": "%m/%d/%Y"
45
+ },
46
+ "table": {
47
+ "label": "Data Table",
48
+ "expanded": true,
49
+ "limitHeight": false,
50
+ "height": "",
51
+ "show": true
52
+ },
53
+ "orientation": "vertical",
54
+ "legend": {
55
+ "behavior": "isolate",
56
+ "position": "right",
57
+ "reverseLabelOrder": false
58
+ },
59
+ "exclusions": {
60
+ "active": false,
61
+ "keys": []
62
+ },
63
+ "palette": "qualitative-bold",
64
+ "isPaletteReversed": false,
65
+ "labels": false,
66
+ "dataFormat": {
67
+ "commas": false,
68
+ "prefix": "",
69
+ "suffix": ""
70
+ },
71
+ "confidenceKeys": {},
72
+ "datasets": {},
73
+ "visualizationType": "Line",
74
+ "data": [
75
+ {
76
+ "Number": "11.0",
77
+ "Date": "9/1/2022"
78
+ },
79
+ {
80
+ "Number": "12.2",
81
+ "Date": "9/2/2022"
82
+ },
83
+ {
84
+ "Number": "13.6",
85
+ "Date": "9/4/2022"
86
+ },
87
+ {
88
+ "Number": "",
89
+ "Date": "9/5/2022"
90
+ },
91
+ {
92
+ "Number": "6.4",
93
+ "Date": "9/6/2022"
94
+ }
95
+ ],
96
+ "series": [
97
+ {
98
+ "dataKey": "Number",
99
+ "type": "Bar"
100
+ }
101
+ ]
102
+ }