@stealthscale/component-charts 0.2.2 → 0.2.3

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 (123) hide show
  1. package/dist/cyclonedx/bom.json +1 -1
  2. package/dist/index.js +1 -14710
  3. package/dist/pages/area-chart/area-chart.js +1151 -0
  4. package/dist/pages/area-chart/area-chart.props.js +3 -0
  5. package/dist/pages/bar-chart/bar-chart.js +990 -0
  6. package/dist/pages/bar-chart/bar-chart.props.js +3 -0
  7. package/dist/pages/box-plot/box-plot.js +1585 -0
  8. package/dist/pages/box-plot/box-plot.props.js +3 -0
  9. package/dist/pages/bubble-chart/bubble-chart.js +938 -0
  10. package/dist/pages/bubble-chart/bubble-chart.props.js +3 -0
  11. package/dist/pages/burndown-chart/burndown-chart.js +805 -0
  12. package/dist/pages/burndown-chart/burndown-chart.props.js +3 -0
  13. package/dist/pages/candlestick-chart/candlestick-chart.js +853 -0
  14. package/dist/pages/candlestick-chart/candlestick-chart.props.js +3 -0
  15. package/dist/pages/chart/chart.js +1190 -0
  16. package/dist/pages/chart/chart.props.js +3 -0
  17. package/dist/pages/chord-diagram/chord-diagram.js +891 -0
  18. package/dist/pages/chord-diagram/chord-diagram.props.js +3 -0
  19. package/dist/pages/combo-chart/combo-chart.js +873 -0
  20. package/dist/pages/combo-chart/combo-chart.props.js +3 -0
  21. package/dist/pages/distribution-chart/distribution-chart.js +1066 -0
  22. package/dist/pages/distribution-chart/distribution-chart.props.js +3 -0
  23. package/dist/pages/donut-chart/donut-chart.js +726 -0
  24. package/dist/pages/donut-chart/donut-chart.props.js +3 -0
  25. package/dist/pages/funnel-chart/funnel-chart.js +1094 -0
  26. package/dist/pages/funnel-chart/funnel-chart.props.js +3 -0
  27. package/dist/pages/gauge-chart/gauge-chart.js +767 -0
  28. package/dist/pages/gauge-chart/gauge-chart.props.js +3 -0
  29. package/dist/pages/heatmap/heatmap.js +1967 -0
  30. package/dist/pages/heatmap/heatmap.props.js +3 -0
  31. package/dist/pages/histogram-chart/histogram-chart.js +768 -0
  32. package/dist/pages/histogram-chart/histogram-chart.props.js +3 -0
  33. package/dist/pages/horizontal-bar-chart/horizontal-bar-chart.js +701 -0
  34. package/dist/pages/horizontal-bar-chart/horizontal-bar-chart.props.js +3 -0
  35. package/dist/pages/line-chart/line-chart.js +1882 -0
  36. package/dist/pages/line-chart/line-chart.props.js +3 -0
  37. package/dist/pages/pages.json +393 -0
  38. package/dist/pages/pareto-chart/pareto-chart.js +669 -0
  39. package/dist/pages/pareto-chart/pareto-chart.props.js +3 -0
  40. package/dist/pages/percent-stacked-bar/percent-stacked-bar.js +662 -0
  41. package/dist/pages/percent-stacked-bar/percent-stacked-bar.props.js +3 -0
  42. package/dist/pages/pie-chart/pie-chart.js +1007 -0
  43. package/dist/pages/pie-chart/pie-chart.props.js +3 -0
  44. package/dist/pages/polar-area-chart/polar-area-chart.js +812 -0
  45. package/dist/pages/polar-area-chart/polar-area-chart.props.js +3 -0
  46. package/dist/pages/radar-chart/radar-chart.js +1101 -0
  47. package/dist/pages/radar-chart/radar-chart.props.js +3 -0
  48. package/dist/pages/radial-bar-chart/radial-bar-chart.js +766 -0
  49. package/dist/pages/radial-bar-chart/radial-bar-chart.props.js +3 -0
  50. package/dist/pages/range-chart/range-chart.js +914 -0
  51. package/dist/pages/range-chart/range-chart.props.js +3 -0
  52. package/dist/pages/regression-overlay/regression-overlay.js +494 -0
  53. package/dist/pages/regression-overlay/regression-overlay.props.js +3 -0
  54. package/dist/pages/sankey-chart/sankey-chart.js +700 -0
  55. package/dist/pages/sankey-chart/sankey-chart.props.js +3 -0
  56. package/dist/pages/scatter-plot/scatter-plot.js +1248 -0
  57. package/dist/pages/scatter-plot/scatter-plot.props.js +3 -0
  58. package/dist/pages/sparkbar/sparkbar.js +629 -0
  59. package/dist/pages/sparkbar/sparkbar.props.js +3 -0
  60. package/dist/pages/sparkline/sparkline.js +960 -0
  61. package/dist/pages/sparkline/sparkline.props.js +3 -0
  62. package/dist/pages/spend-5xQ76WSj.js +185 -0
  63. package/dist/pages/stacked-area-chart/stacked-area-chart.js +912 -0
  64. package/dist/pages/stacked-area-chart/stacked-area-chart.props.js +3 -0
  65. package/dist/pages/stacked-bar-chart/stacked-bar-chart.js +722 -0
  66. package/dist/pages/stacked-bar-chart/stacked-bar-chart.props.js +3 -0
  67. package/dist/pages/step-line-chart/step-line-chart.js +573 -0
  68. package/dist/pages/step-line-chart/step-line-chart.props.js +3 -0
  69. package/dist/pages/stream-graph/stream-graph.js +1662 -0
  70. package/dist/pages/stream-graph/stream-graph.props.js +3 -0
  71. package/dist/pages/sunburst-chart/sunburst-chart.js +1051 -0
  72. package/dist/pages/sunburst-chart/sunburst-chart.props.js +3 -0
  73. package/dist/pages/timeline-chart/timeline-chart.js +1124 -0
  74. package/dist/pages/timeline-chart/timeline-chart.props.js +3 -0
  75. package/dist/pages/treemap-chart/treemap-chart.js +904 -0
  76. package/dist/pages/treemap-chart/treemap-chart.props.js +3 -0
  77. package/dist/pages/violin-plot/violin-plot.js +1303 -0
  78. package/dist/pages/violin-plot/violin-plot.props.js +3 -0
  79. package/dist/pages/visitors-oFFVcbIZ.js +248 -0
  80. package/dist/pages/waterfall-chart/waterfall-chart.js +1195 -0
  81. package/dist/pages/waterfall-chart/waterfall-chart.props.js +3 -0
  82. package/dist/shared-DVZJ2nST.js +14711 -0
  83. package/dist/theme.js +1 -1
  84. package/locales/en/specimen/area-chart.json +56 -0
  85. package/locales/en/specimen/bar-chart.json +56 -0
  86. package/locales/en/specimen/box-plot.json +65 -0
  87. package/locales/en/specimen/bubble-chart.json +47 -0
  88. package/locales/en/specimen/burndown-chart.json +46 -0
  89. package/locales/en/specimen/candlestick-chart.json +42 -0
  90. package/locales/en/specimen/chart.json +53 -0
  91. package/locales/en/specimen/chord-diagram.json +69 -0
  92. package/locales/en/specimen/combo-chart.json +41 -0
  93. package/locales/en/specimen/distribution-chart.json +47 -0
  94. package/locales/en/specimen/donut-chart.json +63 -0
  95. package/locales/en/specimen/funnel-chart.json +84 -0
  96. package/locales/en/specimen/gauge-chart.json +68 -0
  97. package/locales/en/specimen/heatmap.json +187 -0
  98. package/locales/en/specimen/histogram-chart.json +48 -0
  99. package/locales/en/specimen/horizontal-bar-chart.json +54 -0
  100. package/locales/en/specimen/line-chart.json +106 -0
  101. package/locales/en/specimen/pareto-chart.json +43 -0
  102. package/locales/en/specimen/percent-stacked-bar.json +37 -0
  103. package/locales/en/specimen/pie-chart.json +80 -0
  104. package/locales/en/specimen/polar-area-chart.json +90 -0
  105. package/locales/en/specimen/radar-chart.json +82 -0
  106. package/locales/en/specimen/radial-bar-chart.json +62 -0
  107. package/locales/en/specimen/range-chart.json +42 -0
  108. package/locales/en/specimen/regression-overlay.json +36 -0
  109. package/locales/en/specimen/sankey-chart.json +89 -0
  110. package/locales/en/specimen/scatter-plot.json +88 -0
  111. package/locales/en/specimen/sparkbar.json +51 -0
  112. package/locales/en/specimen/sparkline.json +70 -0
  113. package/locales/en/specimen/stacked-area-chart.json +44 -0
  114. package/locales/en/specimen/stacked-bar-chart.json +34 -0
  115. package/locales/en/specimen/step-line-chart.json +33 -0
  116. package/locales/en/specimen/stream-graph.json +54 -0
  117. package/locales/en/specimen/sunburst-chart.json +110 -0
  118. package/locales/en/specimen/timeline-chart.json +77 -0
  119. package/locales/en/specimen/treemap-chart.json +107 -0
  120. package/locales/en/specimen/violin-plot.json +54 -0
  121. package/locales/en/specimen/waterfall-chart.json +71 -0
  122. package/package.json +8 -7
  123. /package/dist/{recipe-BbGw00ut.js → recipes-BbGw00ut.js} +0 -0
@@ -0,0 +1,80 @@
1
+ {
2
+ "about": "The parts of one whole as slices, largest first from 12 o'clock, each with its share written on it. A pie suits two to five parts.",
3
+ "browsers": {
4
+ "about": "maxSlices={4} renders the three largest browsers and gathers the other four into one slice named by otherLabel.",
5
+ "arc": "Arc",
6
+ "caption": "Chrome brought 56% of the 10,490 sessions. The four smallest browsers brought 12% between them.",
7
+ "chrome": "Chrome",
8
+ "edge": "Edge",
9
+ "firefox": "Firefox",
10
+ "label": "Sessions per browser",
11
+ "legend": "Browsers",
12
+ "opera": "Opera",
13
+ "other": "Other browsers",
14
+ "safari": "Safari",
15
+ "samsung": "Samsung Internet",
16
+ "title": "Long tail"
17
+ },
18
+ "largest": {
19
+ "about": "defaultIndex opens the tooltip at the largest slice when the chart first renders. The pointer or the arrow keys move it from slice to slice.",
20
+ "caption": "Starter's 610 customers are 47% of the 1,300.",
21
+ "title": "Tooltip"
22
+ },
23
+ "narrow": {
24
+ "about": "The plan mix in a room 20rem wide, the column of a phone. The pie scales down with the room, and each share is written on its slice.",
25
+ "title": "Narrow room"
26
+ },
27
+ "plans": {
28
+ "about": "Customers per plan, largest first from 12 o'clock, with each plan's share of the 1,300 written on its slice.",
29
+ "caption": "Starter has 47% of the 1,300 customers, Growth 40% and Scale 13%.",
30
+ "growth": "Growth",
31
+ "label": "Customers per plan",
32
+ "legend": "Plans",
33
+ "scale": "Scale",
34
+ "starter": "Starter",
35
+ "title": "Plan mix"
36
+ },
37
+ "quota": {
38
+ "about": "shares={false} leaves the slices unlabelled, for two parts whose figures the caption states. The tooltip writes each in gigabytes.",
39
+ "caption": "142 GB of the 200 GB quota is in use.",
40
+ "free": "Free",
41
+ "label": "Storage quota in use",
42
+ "legend": "Storage",
43
+ "title": "Without shares",
44
+ "used": "In use"
45
+ },
46
+ "regions": {
47
+ "about": "valueOptions writes the tooltip's values in euros. The shares on the slices are of the whole revenue.",
48
+ "americas": "North America",
49
+ "apac": "Asia Pacific",
50
+ "caption": "Europe brought €48,200, 46% of the €105,500 in revenue.",
51
+ "europe": "Europe",
52
+ "label": "Revenue per region",
53
+ "latam": "Latin America",
54
+ "legend": "Regions",
55
+ "title": "Revenue by region"
56
+ },
57
+ "replay": {
58
+ "about": "animate grows the slices from 12 o'clock when the chart mounts, and Replay mounts the chart again. Under reduced motion recharts renders the pie at once.",
59
+ "replay": "Replay",
60
+ "title": "Animation"
61
+ },
62
+ "survey": {
63
+ "about": "defaultHiddenKeys hides No answer on the first render, so the shares are of the 690 people who answered. A press on it in the legend shows it.",
64
+ "caption": "Of the 690 people who answered, 61% said yes.",
65
+ "label": "Answers to the renewal survey",
66
+ "legend": "Answers",
67
+ "no": "No",
68
+ "none": "No answer",
69
+ "title": "Hidden slice",
70
+ "unsure": "Unsure",
71
+ "yes": "Yes"
72
+ },
73
+ "title": "Pie chart",
74
+ "unlaunched": {
75
+ "about": "A chart without slices renders the empty state in the plot's place, and no legend.",
76
+ "caption": "Customers per plan.",
77
+ "empty": "No customers yet.",
78
+ "title": "Empty"
79
+ }
80
+ }
@@ -0,0 +1,90 @@
1
+ {
2
+ "about": "Each category of a cycle as a wedge of the same angle, whose area follows its value. A rose suits categories that wrap, such as hours, months or compass points. A bar chart compares values on their own.",
3
+ "bare": {
4
+ "about": "names false leaves the names off, for a rose read from its legend, and the wedges fill the whole circle.",
5
+ "title": "No names"
6
+ },
7
+ "capacity": {
8
+ "about": "max fixes the full radius at the API's capacity of 2,000 requests a minute, so the rose keeps its size from one day to the next, and noon's wedge extends to 77% of the radius.",
9
+ "caption": "Noon's 1,180 requests a minute use 59% of the 2,000 the API is sized for.",
10
+ "title": "Against a capacity"
11
+ },
12
+ "hidden": {
13
+ "about": "A wedge the legend hides keeps its place with no radius, so no hour turns into the next. defaultHiddenKeys hides noon, and 15:00 becomes the largest value shown.",
14
+ "caption": "With noon hidden, 15:00 is the busiest bucket shown at 1,020 requests a minute.",
15
+ "title": "Hidden wedge"
16
+ },
17
+ "hours": {
18
+ "00": "00:00",
19
+ "03": "03:00",
20
+ "06": "06:00",
21
+ "09": "09:00",
22
+ "12": "12:00",
23
+ "15": "15:00",
24
+ "18": "18:00",
25
+ "21": "21:00"
26
+ },
27
+ "months": {
28
+ "apr": "Apr",
29
+ "aug": "Aug",
30
+ "dec": "Dec",
31
+ "feb": "Feb",
32
+ "jan": "Jan",
33
+ "jul": "Jul",
34
+ "jun": "Jun",
35
+ "mar": "Mar",
36
+ "may": "May",
37
+ "nov": "Nov",
38
+ "oct": "Oct",
39
+ "sep": "Sep"
40
+ },
41
+ "narrow": {
42
+ "about": "The day's requests in a room 20rem wide, the column of a phone.",
43
+ "title": "Narrow room"
44
+ },
45
+ "noon": {
46
+ "about": "defaultIndex opens the tooltip at a wedge when the chart first renders. Its row writes the wedge's name and value. The arrows walk the wedges clockwise from 12 o'clock.",
47
+ "caption": "Noon is the day's peak at 1,180 requests a minute.",
48
+ "title": "Tooltip"
49
+ },
50
+ "points": {
51
+ "e": "E",
52
+ "n": "N",
53
+ "ne": "NE",
54
+ "nw": "NW",
55
+ "s": "S",
56
+ "se": "SE",
57
+ "sw": "SW",
58
+ "w": "W"
59
+ },
60
+ "quiet": {
61
+ "about": "A polar area chart without slices renders the empty state in the plot's place, at the plot's ratio.",
62
+ "caption": "Requests to the API today.",
63
+ "empty": "No requests recorded yet.",
64
+ "title": "Empty"
65
+ },
66
+ "rainfall": {
67
+ "about": "Twelve months as a clock face, January at 12 o'clock. valueOptions writes each value in millimetres in the legend and the tooltip.",
68
+ "caption": "October is the wettest month at 87mm, and April the driest at 42mm.",
69
+ "label": "Rainfall by month",
70
+ "title": "A year"
71
+ },
72
+ "replay": {
73
+ "about": "animate sweeps the wedges in from 12 o'clock when the chart mounts, and Replay mounts the chart again. Under reduced motion recharts renders the wedges at once.",
74
+ "replay": "Replay",
75
+ "title": "Animation"
76
+ },
77
+ "requests": {
78
+ "about": "A day of requests in three-hour buckets, midnight at 12 o'clock. Each wedge's area follows its value, so noon's 1,180 covers about ten times the area of midnight's 120 and extends about 3.1 times as far.",
79
+ "caption": "The load builds from 06:00, peaks at noon and falls by 21:00.",
80
+ "label": "Requests a minute by hour",
81
+ "title": "Requests by hour"
82
+ },
83
+ "title": "Polar area chart",
84
+ "wind": {
85
+ "about": "The hours a month's wind blew from each compass point, north at 12 o'clock. color takes the teal palette for every wedge, and each fill rises with its value.",
86
+ "caption": "The wind blew from the south-west for 212 of the month's 720 hours.",
87
+ "label": "Wind by direction",
88
+ "title": "Colors"
89
+ }
90
+ }
@@ -0,0 +1,82 @@
1
+ {
2
+ "about": "Each series' values across several dimensions, as a polygon on one spoke per dimension. Every spoke reads one scale, and the polygon's shape follows the order of the spokes, so a radar shows a profile while a bar chart compares values.",
3
+ "coverage": {
4
+ "about": "scale writes the radius ticks up the spoke at 12 o'clock. valueDomain fixes the scale at 0 to 100, and valueOptions writes each value in percent. The six ticks step a top of 100 by 20.",
5
+ "caption": "The CLI is the one module under 60% covered.",
6
+ "covered": "Covered",
7
+ "label": "Test coverage by module",
8
+ "title": "Scale"
9
+ },
10
+ "current": "This quarter",
11
+ "dimensions": {
12
+ "cost": "Cost",
13
+ "coverage": "Coverage",
14
+ "latency": "Latency",
15
+ "reliability": "Reliability",
16
+ "throughput": "Throughput"
17
+ },
18
+ "drop": {
19
+ "about": "defaultIndex opens the tooltip at a spoke when the chart first renders. The heading names the spoke, and a row per series writes its value.",
20
+ "caption": "Cost fell from 6 to 4, the one score below last quarter's.",
21
+ "title": "Tooltip"
22
+ },
23
+ "modules": {
24
+ "api": "API",
25
+ "cli": "CLI",
26
+ "jobs": "Jobs",
27
+ "sdk": "SDK",
28
+ "web": "Web"
29
+ },
30
+ "narrow": {
31
+ "about": "The scorecard in a room 20rem wide, the column of a phone. The spokes' names fit around the web.",
32
+ "title": "Narrow room"
33
+ },
34
+ "order": {
35
+ "about": "The scorecard with Cost and Throughput swapped. Every score is the same, and the polygons change shape, so compare radars only with their spokes in one order.",
36
+ "caption": "The scorecard's scores with two spokes swapped render other shapes.",
37
+ "title": "Order of spokes"
38
+ },
39
+ "previous": "Last quarter",
40
+ "profile": {
41
+ "about": "One series, filled in the teal palette's chart color: the profile a radar is for. The legend renders for two series or more.",
42
+ "caption": "The platform team is strongest on backend work and weakest on design.",
43
+ "label": "Skills of the platform team out of 10",
44
+ "team": "Platform team",
45
+ "title": "One profile"
46
+ },
47
+ "quiet": {
48
+ "about": "A radar chart without rows renders the empty state in the plot's place, at the plot's ratio.",
49
+ "caption": "Checkout service scores this quarter.",
50
+ "empty": "No scores for this quarter yet.",
51
+ "title": "Empty"
52
+ },
53
+ "replay": {
54
+ "about": "animate grows each polygon from the centre when the chart mounts, and Replay mounts the chart again. Under reduced motion recharts renders the polygons at once.",
55
+ "replay": "Replay",
56
+ "title": "Animation"
57
+ },
58
+ "scorecard": {
59
+ "about": "Two quarters of a service's scores out of 10 on five dimensions. valueDomain fixes the scale at 0 to 10 on every spoke, and each polygon fills at 0.25 of its color.",
60
+ "caption": "Cost is the only score that fell this quarter, from 6 to 4.",
61
+ "label": "Checkout service scores out of 10",
62
+ "title": "Scorecard"
63
+ },
64
+ "skills": {
65
+ "backend": "Backend",
66
+ "data": "Data",
67
+ "design": "Design",
68
+ "frontend": "Frontend",
69
+ "operations": "Operations",
70
+ "security": "Security"
71
+ },
72
+ "teams": {
73
+ "about": "Three teams as outlines: filled false leaves each polygon unfilled, so the edges of three overlapping shapes can be told apart.",
74
+ "caption": "Identity leads on reliability and coverage, and search on latency.",
75
+ "identity": "Identity",
76
+ "label": "Team scores out of 10",
77
+ "payments": "Payments",
78
+ "search": "Search",
79
+ "title": "Outlines"
80
+ },
81
+ "title": "Radar chart"
82
+ }
@@ -0,0 +1,62 @@
1
+ {
2
+ "about": "Each measure as a ring read against the value of a full turn, the first ring outermost. A ring shows a measure against its own track, such as the use of a quota. A bar chart compares measures with each other.",
3
+ "activity": {
4
+ "about": "A day's activity against three goals, each ring in a hue palette's chart color through its bar's color.",
5
+ "caption": "Standing is at 90% of today's goal, and exercise at 45%.",
6
+ "exercise": "Exercise",
7
+ "label": "Activity against today's goals",
8
+ "move": "Move",
9
+ "stand": "Stand",
10
+ "title": "Colors"
11
+ },
12
+ "bare": {
13
+ "about": "track false leaves out each ring's remainder, so a ring reads as a length with nothing to be a share of.",
14
+ "caption": "API calls are at 34% of the plan's quota.",
15
+ "title": "No track"
16
+ },
17
+ "dial": {
18
+ "about": "startAngle 225 and endAngle -45 turn each ring three quarters of the way round, clockwise through 12 o'clock, with the gap at the bottom.",
19
+ "caption": "Storage is at 82% of the plan's quota.",
20
+ "title": "Three quarters of a turn"
21
+ },
22
+ "narrow": {
23
+ "about": "The plan's usage in a room 20rem wide, the column of a phone.",
24
+ "title": "Narrow room"
25
+ },
26
+ "over": {
27
+ "about": "max 1 fixes a full turn at the quota. Storage at 114% closes its track and the legend writes its value, while seats and API calls keep their share of the quota.",
28
+ "caption": "Storage is 14% over the plan's quota.",
29
+ "title": "Past max"
30
+ },
31
+ "quiet": {
32
+ "about": "A radial bar chart without bars renders the empty state in the plot's place, at the plot's ratio.",
33
+ "caption": "Plan usage this month.",
34
+ "empty": "No usage recorded yet.",
35
+ "title": "Empty"
36
+ },
37
+ "replay": {
38
+ "about": "animate grows each ring from its start angle when the chart mounts, and Replay mounts the chart again. Under reduced motion recharts renders the rings at once.",
39
+ "replay": "Replay",
40
+ "title": "Animation"
41
+ },
42
+ "scaled": {
43
+ "about": "Without max the largest value shown closes its track, so Storage at 82% reads as full and every other ring is measured against it.",
44
+ "caption": "Storage's 82% closes its track, while nothing on the plan is full.",
45
+ "title": "Without max"
46
+ },
47
+ "seats": {
48
+ "about": "defaultIndex opens the tooltip at a ring when the chart first renders. Its row writes the ring's name and value. The arrows walk the rings from the outermost.",
49
+ "caption": "Seats are at 61% of the plan's quota.",
50
+ "title": "Tooltip"
51
+ },
52
+ "title": "Radial bar chart",
53
+ "usage": {
54
+ "about": "A plan's use of three quotas. max 1 makes a full turn the whole quota, so each ring reads as a share of its own track, and the legend writes each value beside its name.",
55
+ "api": "API calls",
56
+ "caption": "Storage is at 82% of the plan's quota, and nothing else is past two thirds.",
57
+ "label": "Plan usage",
58
+ "seats": "Seats",
59
+ "storage": "Storage",
60
+ "title": "Plan usage"
61
+ }
62
+ }
@@ -0,0 +1,42 @@
1
+ {
2
+ "about": "A band between two fields of each row, and lines plotted over it. The band is the uncertainty and the line the estimate, so a forecast shows how far it can miss.",
3
+ "forecast": {
4
+ "about": "Weekly active users as a solid line, the forecast after August 24 as a dashed line, and its 80% interval as a band that widens with the horizon. valueDomain runs the axis from 10,000 to 20,000.",
5
+ "actual": "Actual",
6
+ "caption": "Weekly active users are forecast to grow to 17,500 by October 5, between 15,500 and 19,500 at 80% confidence.",
7
+ "forecast": "Forecast",
8
+ "interval": "80% interval",
9
+ "label": "Weekly active users",
10
+ "title": "Forecast"
11
+ },
12
+ "horizon": {
13
+ "about": "defaultIndex opens the tooltip at the last week when the chart first renders. The tooltip writes the band as its two ends.",
14
+ "caption": "The interval on October 5 is 4,000 users wide, against 1,200 a week after the last reading.",
15
+ "title": "Tooltip"
16
+ },
17
+ "narrow": {
18
+ "about": "The forecast in a room 20rem wide, the column of a phone.",
19
+ "title": "Narrow room"
20
+ },
21
+ "quiet": {
22
+ "about": "A range without rows renders the empty state in the plot's place, at the plot's ratio.",
23
+ "caption": "Forecast of weekly active users.",
24
+ "empty": "The forecast starts after 8 weeks of readings.",
25
+ "title": "Empty"
26
+ },
27
+ "replay": {
28
+ "about": "animate reveals the band and the line from the start of the axis when the chart mounts, and Replay mounts the chart again. Under reduced motion recharts renders them at once.",
29
+ "replay": "Replay",
30
+ "title": "Animation"
31
+ },
32
+ "series": "Series",
33
+ "temperature": {
34
+ "about": "Each day's low and high temperature as a band, and the day's average as a line through it, in degrees Celsius.",
35
+ "average": "Average",
36
+ "caption": "Wednesday was the warmest day, from 14 to 22°C.",
37
+ "label": "Temperature per day in Amsterdam",
38
+ "range": "Daily range",
39
+ "title": "Daily range"
40
+ },
41
+ "title": "Range chart"
42
+ }
@@ -0,0 +1,36 @@
1
+ {
2
+ "about": "A dashed trend line across a scatter: the least-squares line through the points, over the range of x the points cover. linearRegression returns the line's r², which the page states and reads to decide whether the line belongs on the chart.",
3
+ "channels": {
4
+ "about": "Each series takes a RegressionOverlay with series set to its key. Each line takes its series' color, hides while the legend hides the series, and fades while the legend points at the other series.",
5
+ "caption": "Online, each euro on the price costs about {{online}} units a week. In store, it costs about {{store}}.",
6
+ "label": "Weekly units by price and channel",
7
+ "online": "Online",
8
+ "price": "Price",
9
+ "store": "In store",
10
+ "title": "Trend line per series",
11
+ "units": "Units a week"
12
+ },
13
+ "fit": {
14
+ "about": "A RegressionOverlay child of a ScatterPlot fits the fourteen products. The line runs from the cheapest product to the dearest and no further, dashed in the neutral palette's chart color.",
15
+ "caption": "Each euro on the price costs about {{units}} units a week, with an r² of {{r2}}.",
16
+ "label": "Weekly units by price",
17
+ "price": "Price",
18
+ "products": "Products",
19
+ "title": "Trend line",
20
+ "units": "Units a week"
21
+ },
22
+ "narrow": {
23
+ "about": "The fitted products in a room 20rem wide, the column of a phone.",
24
+ "title": "Narrow room"
25
+ },
26
+ "title": "Regression overlay",
27
+ "weak": {
28
+ "about": "The page reads r² from linearRegression and renders the overlay only at 0.5 or more. A straight line through a cloud like this one would picture a relationship the data does not show.",
29
+ "caption": "Team size accounts for {{share}} of the variance in weekly deploys, so the page shows no trend line.",
30
+ "deploys": "Deploys a week",
31
+ "label": "Weekly deploys by team size",
32
+ "people": "People",
33
+ "teams": "Teams",
34
+ "title": "Weak fit"
35
+ }
36
+ }
@@ -0,0 +1,89 @@
1
+ {
2
+ "about": "Flows between the stages of a process as bands whose widths follow their values, such as a month's visitors by channel, then by what they did. Each node is a bar in its own color with its name beside it, and each flow is a band in its source's color. The arrow keys walk each node, then the flows it sends. A sankey shows where a quantity goes as it splits and merges, and a funnel is the better chart for one path.",
3
+ "in": "In",
4
+ "income": {
5
+ "about": "A year's income statement: three lines of revenue add up to the revenue, which splits into its cost and the gross profit, which splits into the costs of running the company and the operating profit. valueOptions writes the amounts in compact euros.",
6
+ "caption": "Operating profit is €1.5M of €11.7M in revenue.",
7
+ "label": "Income statement for the year",
8
+ "title": "An income statement",
9
+ "value": "Amount"
10
+ },
11
+ "leak": {
12
+ "about": "flowBalance returns each node's inflow and outflow. Triage receives 1,200 tickets and sends 1,050 on, so its bar is taller than the bands that leave it, and the caption names the difference.",
13
+ "caption": "{{name}} receives {{lost}} more tickets than it sends on.",
14
+ "label": "Support tickets for the week by channel and outcome",
15
+ "title": "A leak",
16
+ "value": "Tickets"
17
+ },
18
+ "loop": {
19
+ "about": "25 refunded customers came back to the cart, a flow that closes a loop. A sankey shows flow in one direction, so the chart leaves the flow out, and sankeyCycles returns it for the caption.",
20
+ "caption_one": "{{names}} closes a loop, so the chart leaves it out.",
21
+ "caption_other": "{{names}} close loops, so the chart leaves them out.",
22
+ "flow": "{{from}} → {{to}}",
23
+ "label": "Carts for the week by outcome",
24
+ "title": "A loop left out",
25
+ "value": "Carts"
26
+ },
27
+ "names": {
28
+ "abandoned": "Abandoned",
29
+ "admin": "Administration",
30
+ "cancelled": "Cancelled",
31
+ "cart": "Cart",
32
+ "chat": "Chat",
33
+ "checkout": "Checkout",
34
+ "cost": "Cost of revenue",
35
+ "email": "Email",
36
+ "escalated": "Escalated",
37
+ "free": "Free plan",
38
+ "gross": "Gross profit",
39
+ "hardware": "Hardware",
40
+ "left": "Left",
41
+ "operating": "Operating profit",
42
+ "ordered": "Ordered",
43
+ "organic": "Organic search",
44
+ "paid": "Paid search",
45
+ "phone": "Phone",
46
+ "refunded": "Refunded",
47
+ "research": "Research",
48
+ "revenue": "Revenue",
49
+ "sales": "Sales",
50
+ "services": "Services",
51
+ "signup": "Signed up",
52
+ "social": "Social",
53
+ "solved": "Solved",
54
+ "subscribed": "Subscribed",
55
+ "subscriptions": "Subscriptions",
56
+ "trial": "Trial",
57
+ "triage": "Triage"
58
+ },
59
+ "narrow": {
60
+ "about": "The visitors in a room 20rem wide, the column of a phone. The columns move closer, and each name is written beside its bar.",
61
+ "title": "Narrow room"
62
+ },
63
+ "out": "Out",
64
+ "palette": {
65
+ "about": "Each channel states its palette: organic teal, paid purple, social orange, email pink. Every other node takes the next series color, and each band takes its source's color. values false leaves the values out.",
66
+ "caption": "Most visitors left without signing up.",
67
+ "title": "Palettes"
68
+ },
69
+ "quiet": {
70
+ "about": "A sankey without flows renders the empty state in the plot's place, at the plot's ratio.",
71
+ "caption": "Visitors this month.",
72
+ "empty": "No visitors in this period.",
73
+ "title": "Empty"
74
+ },
75
+ "share": "Of source",
76
+ "signups": {
77
+ "about": "defaultIndex opens the tooltip at the second mark of the walk, the organic visitors who signed up, when the chart first renders. The walk visits each node, then the flows it sends. The band lifts, the other marks fade, and the tooltip writes the flow's value and its share of the channel's visitors.",
78
+ "caption": "Organic search sent 3,100 of the 7,000 sign-ups.",
79
+ "title": "Tooltip"
80
+ },
81
+ "title": "Sankey chart",
82
+ "visitors": {
83
+ "about": "September's 25,900 visitors by channel, then by what they did. Each channel is a bar in its own color, and its bands take that color to where the visitors went. A node that sends nothing is at the last column with its name before its bar. flowBalance returns each node's inflow and outflow, and the caption states two rates from it.",
84
+ "caption": "{{signedUp}}% of visitors signed up, and {{subscribed}}% of those who signed up subscribed.",
85
+ "label": "Visitors for September by channel and outcome",
86
+ "title": "Visitors by channel and outcome",
87
+ "value": "Visitors"
88
+ }
89
+ }
@@ -0,0 +1,88 @@
1
+ {
2
+ "about": "A point per thing at two measures, and a series per group of things. Both axes take a title, because neither explains itself, and the tooltip names each value by its axis' title under the point's series.",
3
+ "crowded": {
4
+ "about": "The risks in a room 20rem wide. A name that leaves the plot, or meets the name of a point earlier in the series, is hidden, so the first of two close points keeps its name. The tooltip still names every point.",
5
+ "title": "Crowded names"
6
+ },
7
+ "deals": {
8
+ "about": "Deal size against days to close for two segments. Each series takes its own points, because a scatter's series share no category. The keyboard layer's arrows walk the first series' points.",
9
+ "caption": "Mid-market deals close within 50 days, while enterprise deals take 88 to 178 days.",
10
+ "days": "Days to close",
11
+ "enterprise": "Enterprise",
12
+ "label": "Days to close by deal size",
13
+ "mid": "Mid-market",
14
+ "size": "Deal size",
15
+ "title": "Two series"
16
+ },
17
+ "narrow": {
18
+ "about": "The deals in a room 20rem wide, the column of a phone. Both axes keep their titles.",
19
+ "title": "Narrow room"
20
+ },
21
+ "orders": {
22
+ "about": "Thirty orders of one shop as small points: size sets every point's area in square pixels, 30 here against the 60 a scatter takes by default.",
23
+ "caption": "Order value rises by about €17 for each item in the order.",
24
+ "items": "Items",
25
+ "label": "Order value by items",
26
+ "orders": "Orders",
27
+ "title": "Point size",
28
+ "value": "Order value"
29
+ },
30
+ "quadrants": {
31
+ "about": "quadrants divides the plot at the middle of each axis and names each quadrant in its corner. labelKey writes each vendor's name beside its point, and xEnds and yEnds name each axis' ends in place of its ticks. The tooltip heads a point with its name and its quadrant.",
32
+ "caption": "Alder and Cedar lead on both vision and execution.",
33
+ "challengers": "Challengers",
34
+ "execution": "Execution",
35
+ "high": "High",
36
+ "label": "Vendors by vision and execution",
37
+ "leaders": "Leaders",
38
+ "low": "Low",
39
+ "niche": "Niche players",
40
+ "title": "Quadrants",
41
+ "vendors": "Vendors",
42
+ "vision": "Vision",
43
+ "visionaries": "Visionaries"
44
+ },
45
+ "quiet": {
46
+ "about": "A scatter without points renders the empty state in the plot's place, at the plot's ratio.",
47
+ "caption": "Days to close by deal size this quarter.",
48
+ "deals": "Deals",
49
+ "empty": "No deals closed this quarter.",
50
+ "title": "Empty"
51
+ },
52
+ "replay": {
53
+ "about": "animate grows each point from its centre when the chart mounts, and Replay mounts the chart again. Under reduced motion recharts renders the points at once.",
54
+ "replay": "Replay",
55
+ "title": "Animation"
56
+ },
57
+ "risks": {
58
+ "about": "spreadPoints moves the second of two risks with equal scores along a spiral until the two are 0.15 of the axes' spans apart, and never across a dividing line. The tooltip writes the moved scores, so spread points suit a chart that people read by quadrant.",
59
+ "accept": "Accept",
60
+ "act": "Act now",
61
+ "breach": "Data breach",
62
+ "caption": "A cloud outage and payment fraud are both likely and severe.",
63
+ "certain": "Certain",
64
+ "currency": "Currency swing",
65
+ "fraud": "Payment fraud",
66
+ "impact": "Impact",
67
+ "label": "Risks by likelihood and impact",
68
+ "likelihood": "Likelihood",
69
+ "minor": "Minor",
70
+ "outage": "Cloud outage",
71
+ "prepare": "Prepare",
72
+ "price": "Price war",
73
+ "rare": "Rare",
74
+ "reduce": "Reduce",
75
+ "risks": "Risks",
76
+ "severe": "Severe",
77
+ "supplier": "Supplier exit",
78
+ "title": "Spread points",
79
+ "turnover": "Staff turnover"
80
+ },
81
+ "segments": "Segments",
82
+ "slowest": {
83
+ "about": "defaultIndex opens the tooltip at a point of the first series when the chart first renders. The heading names the point's series, and each row names its value by the axis' title.",
84
+ "caption": "The slowest mid-market deal, €27K, took 49 days to close.",
85
+ "title": "Tooltip"
86
+ },
87
+ "title": "Scatter plot"
88
+ }
@@ -0,0 +1,51 @@
1
+ {
2
+ "about": "A run of counts, one bar per period, at the size of a word, without axes or a tooltip. A bar is read by its length, so the bars start at zero.",
3
+ "deploys": {
4
+ "about": "The week's deploys as a stat with a bar per day beside it. The sparkbar is hidden from assistive technology, because the stat states the figure.",
5
+ "help": "None on Sunday",
6
+ "label": "Deploys this week",
7
+ "title": "Beside a figure",
8
+ "value": "38"
9
+ },
10
+ "incidents": {
11
+ "about": "label names a run shown without a figure, as an image with that name, here in the error palette. It takes no tab stop.",
12
+ "label": "Incidents per week over the last 12 weeks, 21 in all",
13
+ "title": "Without a figure"
14
+ },
15
+ "orders": {
16
+ "about": "baseline={120} renders a dashed line at the daily target, and color takes the teal palette's chart color.",
17
+ "help": "At or above the 120 target on 4 of 7 days",
18
+ "label": "Orders per day",
19
+ "title": "Baseline",
20
+ "value": "856"
21
+ },
22
+ "outage": {
23
+ "about": "A value that is not a finite number leaves its period empty. A zero leaves it empty too, so the help text names the day without a reading.",
24
+ "help": "No reading on Thursday",
25
+ "label": "Sign-ups per day",
26
+ "title": "Missing reading",
27
+ "value": "1,373"
28
+ },
29
+ "replay": {
30
+ "about": "animate grows the bars from zero when the sparkbar mounts, and Replay mounts it again. Under reduced motion recharts renders them at once.",
31
+ "label": "Deploys per day this week",
32
+ "replay": "Replay",
33
+ "title": "Animation"
34
+ },
35
+ "seats": {
36
+ "about": "signed renders a fall in the error palette's chart color, for a change per period: seats gained or lost each day over two weeks.",
37
+ "help": "Seats lost on 4 of 14 days",
38
+ "label": "Net seats per day",
39
+ "title": "Signed",
40
+ "value": "+36"
41
+ },
42
+ "size": {
43
+ "about": "Three boxes on the grid, four times as wide as they are tall: 64 by 16 pixels at sm, 96 by 24 at md and 128 by 32 at lg.",
44
+ "title": "Sizes"
45
+ },
46
+ "stretch": {
47
+ "about": "stretch fills the width of the container at the size's height, here a room 24rem wide.",
48
+ "title": "Stretch"
49
+ },
50
+ "title": "Sparkbar"
51
+ }