@opendata-ai/openchart-engine 8.0.0-rc.9 → 8.0.0
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/dist/index.d.ts +149 -12
- package/dist/index.js +804 -155
- package/dist/index.js.map +1 -1
- package/package.json +3 -4
- package/src/__test-fixtures__/specs.ts +0 -182
- package/src/__tests__/__snapshots__/compile-snapshot.test.ts.snap +0 -2401
- package/src/__tests__/annotation-behavior.test.ts +0 -852
- package/src/__tests__/axes.test.ts +0 -1579
- package/src/__tests__/compile-animation.test.ts +0 -161
- package/src/__tests__/compile-chart.test.ts +0 -1303
- package/src/__tests__/compile-footnotes.test.ts +0 -277
- package/src/__tests__/compile-layer.test.ts +0 -969
- package/src/__tests__/compile-snapshot.test.ts +0 -156
- package/src/__tests__/compound-labels.test.ts +0 -147
- package/src/__tests__/dimensions.test.ts +0 -918
- package/src/__tests__/encoding-sugar.test.ts +0 -390
- package/src/__tests__/facet.test.ts +0 -215
- package/src/__tests__/helpers/invariants.ts +0 -299
- package/src/__tests__/known-bugs.test.ts +0 -566
- package/src/__tests__/layout-fuzz.test.ts +0 -358
- package/src/__tests__/layout-invariants.test.ts +0 -535
- package/src/__tests__/legend.test.ts +0 -721
- package/src/__tests__/mark-keys.test.ts +0 -294
- package/src/__tests__/ranking-recipes.test.ts +0 -260
- package/src/__tests__/rotation.test.ts +0 -83
- package/src/__tests__/scales.test.ts +0 -323
- package/src/__tests__/series-search.test.ts +0 -92
- package/src/__tests__/spec-sugar.test.ts +0 -801
- package/src/__tests__/you-draw-it.test.ts +0 -160
- package/src/annotations/__tests__/compute.test.ts +0 -1672
- package/src/annotations/__tests__/geometry.test.ts +0 -66
- package/src/annotations/__tests__/placement-fuzz.test.ts +0 -256
- package/src/annotations/__tests__/placement-invariants.test.ts +0 -345
- package/src/annotations/__tests__/placement.test.ts +0 -316
- package/src/annotations/__tests__/resolve-text.test.ts +0 -788
- package/src/annotations/__tests__/rich-text.test.ts +0 -91
- package/src/annotations/__tests__/thinning.test.ts +0 -285
- package/src/annotations/collisions.ts +0 -326
- package/src/annotations/compute.ts +0 -333
- package/src/annotations/constants.ts +0 -162
- package/src/annotations/geometry.ts +0 -376
- package/src/annotations/move.ts +0 -135
- package/src/annotations/placement.ts +0 -636
- package/src/annotations/position.ts +0 -131
- package/src/annotations/resolve-range.ts +0 -117
- package/src/annotations/resolve-refline.ts +0 -157
- package/src/annotations/resolve-text.ts +0 -545
- package/src/annotations/rich-text.ts +0 -65
- package/src/annotations/thinning.ts +0 -190
- package/src/barlist/__tests__/compile-barlist.test.ts +0 -200
- package/src/barlist/compile-barlist.ts +0 -391
- package/src/barlist/types.ts +0 -28
- package/src/charts/__tests__/post-process.test.ts +0 -237
- package/src/charts/__tests__/registry.test.ts +0 -116
- package/src/charts/__tests__/utils.test.ts +0 -195
- package/src/charts/_shared/__tests__/density-filter.test.ts +0 -32
- package/src/charts/_shared/density-filter.ts +0 -26
- package/src/charts/_shared/format-label-value.ts +0 -16
- package/src/charts/bar/__tests__/compute.test.ts +0 -934
- package/src/charts/bar/__tests__/gradient-orient.test.ts +0 -127
- package/src/charts/bar/__tests__/labels.test.ts +0 -292
- package/src/charts/bar/compute.ts +0 -539
- package/src/charts/bar/index.ts +0 -60
- package/src/charts/bar/labels.ts +0 -311
- package/src/charts/beeswarm/__tests__/compute.test.ts +0 -280
- package/src/charts/beeswarm/__tests__/dodge.test.ts +0 -148
- package/src/charts/beeswarm/compute.ts +0 -203
- package/src/charts/beeswarm/dodge.ts +0 -155
- package/src/charts/beeswarm/index.ts +0 -32
- package/src/charts/builtin.ts +0 -75
- package/src/charts/calendar/__tests__/compute.test.ts +0 -417
- package/src/charts/calendar/compute.ts +0 -319
- package/src/charts/calendar/index.ts +0 -32
- package/src/charts/column/__tests__/compute.test.ts +0 -540
- package/src/charts/column/__tests__/labels.test.ts +0 -179
- package/src/charts/column/compute.ts +0 -493
- package/src/charts/column/index.ts +0 -53
- package/src/charts/column/labels.ts +0 -229
- package/src/charts/dot/__tests__/compute.test.ts +0 -380
- package/src/charts/dot/__tests__/labels.test.ts +0 -98
- package/src/charts/dot/compute.ts +0 -285
- package/src/charts/dot/index.ts +0 -62
- package/src/charts/dot/labels.ts +0 -121
- package/src/charts/line/__tests__/compute.test.ts +0 -1194
- package/src/charts/line/__tests__/curves.test.ts +0 -51
- package/src/charts/line/__tests__/labels.test.ts +0 -94
- package/src/charts/line/__tests__/mark-options.test.ts +0 -175
- package/src/charts/line/area.ts +0 -484
- package/src/charts/line/compute.ts +0 -356
- package/src/charts/line/curves.ts +0 -85
- package/src/charts/line/index.ts +0 -176
- package/src/charts/line/labels.ts +0 -177
- package/src/charts/parliament/__tests__/compute.test.ts +0 -411
- package/src/charts/parliament/compute.ts +0 -313
- package/src/charts/parliament/index.ts +0 -32
- package/src/charts/pie/__tests__/compute.test.ts +0 -384
- package/src/charts/pie/__tests__/labels.test.ts +0 -132
- package/src/charts/pie/compute.ts +0 -324
- package/src/charts/pie/index.ts +0 -49
- package/src/charts/pie/labels.ts +0 -143
- package/src/charts/post-process.ts +0 -229
- package/src/charts/range/__tests__/compute.test.ts +0 -486
- package/src/charts/range/compute.ts +0 -273
- package/src/charts/range/index.ts +0 -82
- package/src/charts/range/labels.ts +0 -169
- package/src/charts/rect/__tests__/compute.test.ts +0 -120
- package/src/charts/rect/index.ts +0 -127
- package/src/charts/registry.ts +0 -72
- package/src/charts/rule/index.ts +0 -139
- package/src/charts/scatter/__tests__/compute.test.ts +0 -488
- package/src/charts/scatter/__tests__/trendline.test.ts +0 -191
- package/src/charts/scatter/compute.ts +0 -192
- package/src/charts/scatter/index.ts +0 -46
- package/src/charts/scatter/trendline.ts +0 -100
- package/src/charts/text/__tests__/compute.test.ts +0 -307
- package/src/charts/text/index.ts +0 -141
- package/src/charts/tick/__tests__/compute.test.ts +0 -75
- package/src/charts/tick/index.ts +0 -99
- package/src/charts/utils.ts +0 -170
- package/src/charts/waffle/__tests__/compute.test.ts +0 -305
- package/src/charts/waffle/compute.ts +0 -197
- package/src/charts/waffle/index.ts +0 -31
- package/src/compile/__tests__/color-scale-range.test.ts +0 -158
- package/src/compile/__tests__/color-scale-reverse.test.ts +0 -89
- package/src/compile/__tests__/data-clip.test.ts +0 -127
- package/src/compile/__tests__/fill-patterns.test.ts +0 -154
- package/src/compile/__tests__/size-scale.test.ts +0 -108
- package/src/compile/__tests__/watermark-obstacle.test.ts +0 -93
- package/src/compile/color-scale-range.ts +0 -101
- package/src/compile/data-clip.ts +0 -48
- package/src/compile/fill-patterns.ts +0 -74
- package/src/compile/layer.ts +0 -630
- package/src/compile/size-scale.ts +0 -141
- package/src/compile/spec-sugar.ts +0 -758
- package/src/compile/watermark-obstacle.ts +0 -54
- package/src/compile/you-draw-it.ts +0 -123
- package/src/compile.ts +0 -1503
- package/src/compiler/__tests__/a11y-warnings.test.ts +0 -148
- package/src/compiler/__tests__/animation.test.ts +0 -177
- package/src/compiler/__tests__/compile.test.ts +0 -87
- package/src/compiler/__tests__/fixtures/vl-parity/axis-null.json +0 -19
- package/src/compiler/__tests__/fixtures/vl-parity/color-value.json +0 -20
- package/src/compiler/__tests__/fixtures/vl-parity/count-aggregate.json +0 -22
- package/src/compiler/__tests__/fixtures/vl-parity/data-values.json +0 -19
- package/src/compiler/__tests__/fixtures/vl-parity/layer-axis-null.json +0 -14
- package/src/compiler/__tests__/fixtures/vl-parity/layer-count.json +0 -34
- package/src/compiler/__tests__/fixtures/vl-parity/layer-data-values.json +0 -22
- package/src/compiler/__tests__/fixtures/vl-parity/layer-legend-null.json +0 -41
- package/src/compiler/__tests__/fixtures/vl-parity/layer-scheme.json +0 -38
- package/src/compiler/__tests__/fixtures/vl-parity/layer-sort.json +0 -28
- package/src/compiler/__tests__/fixtures/vl-parity/layer-theta.json +0 -28
- package/src/compiler/__tests__/fixtures/vl-parity/layer-title.json +0 -30
- package/src/compiler/__tests__/fixtures/vl-parity/layer-value-def.json +0 -29
- package/src/compiler/__tests__/fixtures/vl-parity/legend-null.json +0 -32
- package/src/compiler/__tests__/fixtures/vl-parity/scheme.json +0 -25
- package/src/compiler/__tests__/fixtures/vl-parity/sort-by-value.json +0 -19
- package/src/compiler/__tests__/fixtures/vl-parity/theta-arc.json +0 -19
- package/src/compiler/__tests__/fixtures/vl-parity/title-subtitle.json +0 -21
- package/src/compiler/__tests__/fixtures/vl-parity/width-height.json +0 -23
- package/src/compiler/__tests__/keys.test.ts +0 -83
- package/src/compiler/__tests__/normalize-highlight.test.ts +0 -103
- package/src/compiler/__tests__/normalize.test.ts +0 -399
- package/src/compiler/__tests__/sparkline-defaults.test.ts +0 -153
- package/src/compiler/__tests__/validate-did-you-mean.test.ts +0 -170
- package/src/compiler/__tests__/validate-highlight.test.ts +0 -112
- package/src/compiler/__tests__/validate-near-miss.test.ts +0 -251
- package/src/compiler/__tests__/validate.test.ts +0 -629
- package/src/compiler/__tests__/vl-parity.test.ts +0 -68
- package/src/compiler/a11y-warnings.ts +0 -110
- package/src/compiler/animation.ts +0 -142
- package/src/compiler/index.ts +0 -47
- package/src/compiler/keys.ts +0 -55
- package/src/compiler/normalize.ts +0 -734
- package/src/compiler/sparkline-defaults.ts +0 -138
- package/src/compiler/types.ts +0 -241
- package/src/compiler/validate.ts +0 -2041
- package/src/endpoint-labels/__tests__/compute.test.ts +0 -587
- package/src/endpoint-labels/compute.ts +0 -621
- package/src/endpoint-labels/constants.ts +0 -54
- package/src/endpoint-labels/format.ts +0 -60
- package/src/endpoint-labels/predict.ts +0 -139
- package/src/format/__tests__/field-format.test.ts +0 -164
- package/src/format/field-format.ts +0 -27
- package/src/geo/__tests__/compile-map.test.ts +0 -1128
- package/src/geo/compile-map.ts +0 -1376
- package/src/geo/join.ts +0 -115
- package/src/geo/projections.ts +0 -65
- package/src/geo/types.ts +0 -26
- package/src/graphs/__tests__/community.test.ts +0 -228
- package/src/graphs/__tests__/compile-graph.test.ts +0 -396
- package/src/graphs/__tests__/encoding.test.ts +0 -415
- package/src/graphs/community.ts +0 -92
- package/src/graphs/compile-graph.ts +0 -329
- package/src/graphs/encoding.ts +0 -356
- package/src/graphs/types.ts +0 -106
- package/src/index.ts +0 -177
- package/src/layout/__tests__/metrics.test.ts +0 -97
- package/src/layout/__tests__/scales-highlight.test.ts +0 -192
- package/src/layout/axes/rotation.ts +0 -152
- package/src/layout/axes/thinning.ts +0 -98
- package/src/layout/axes/ticks.ts +0 -409
- package/src/layout/axes.ts +0 -757
- package/src/layout/dimensions.ts +0 -912
- package/src/layout/facet.ts +0 -91
- package/src/layout/gridlines.ts +0 -84
- package/src/layout/metrics.ts +0 -132
- package/src/layout/plan.ts +0 -631
- package/src/layout/scales.ts +0 -1053
- package/src/layout/shared.ts +0 -44
- package/src/legend/__tests__/continuous.test.ts +0 -318
- package/src/legend/__tests__/redundancy.test.ts +0 -108
- package/src/legend/__tests__/size.test.ts +0 -348
- package/src/legend/__tests__/suppression.test.ts +0 -382
- package/src/legend/compute.ts +0 -748
- package/src/legend/continuous.ts +0 -327
- package/src/legend/size.ts +0 -407
- package/src/legend/suppression.ts +0 -226
- package/src/legend/wrap.ts +0 -117
- package/src/sankey/__tests__/compile-sankey.test.ts +0 -458
- package/src/sankey/__tests__/layout.test.ts +0 -165
- package/src/sankey/__tests__/node-label-wrap.test.ts +0 -114
- package/src/sankey/__tests__/node-sort.test.ts +0 -45
- package/src/sankey/compile-sankey.ts +0 -706
- package/src/sankey/layout.ts +0 -184
- package/src/sankey/types.ts +0 -41
- package/src/tables/__tests__/bar-column.test.ts +0 -147
- package/src/tables/__tests__/category-colors.test.ts +0 -230
- package/src/tables/__tests__/compile-table.test.ts +0 -236
- package/src/tables/__tests__/format-cells.test.ts +0 -143
- package/src/tables/__tests__/heatmap.test.ts +0 -148
- package/src/tables/__tests__/pagination.test.ts +0 -78
- package/src/tables/__tests__/search.test.ts +0 -94
- package/src/tables/__tests__/sort.test.ts +0 -107
- package/src/tables/__tests__/sparkline.test.ts +0 -122
- package/src/tables/bar-column.ts +0 -94
- package/src/tables/category-colors.ts +0 -78
- package/src/tables/compile-table.ts +0 -427
- package/src/tables/format-cells.ts +0 -115
- package/src/tables/heatmap.ts +0 -141
- package/src/tables/pagination.ts +0 -46
- package/src/tables/search.ts +0 -66
- package/src/tables/sort.ts +0 -69
- package/src/tables/sparkline.ts +0 -113
- package/src/tables/utils.ts +0 -16
- package/src/tilemap/__tests__/compile-tilemap.test.ts +0 -576
- package/src/tilemap/compile-tilemap.ts +0 -755
- package/src/tilemap/layout.ts +0 -172
- package/src/tilemap/types.ts +0 -33
- package/src/tooltips/__tests__/compute.test.ts +0 -582
- package/src/tooltips/compute.ts +0 -700
- package/src/transforms/__tests__/aggregate.test.ts +0 -159
- package/src/transforms/__tests__/bin.test.ts +0 -88
- package/src/transforms/__tests__/calculate.test.ts +0 -146
- package/src/transforms/__tests__/conditional.test.ts +0 -127
- package/src/transforms/__tests__/filter-relative.test.ts +0 -202
- package/src/transforms/__tests__/filter.test.ts +0 -59
- package/src/transforms/__tests__/fold.test.ts +0 -79
- package/src/transforms/__tests__/index.test.ts +0 -93
- package/src/transforms/__tests__/predicates.test.ts +0 -193
- package/src/transforms/__tests__/timeunit.test.ts +0 -129
- package/src/transforms/__tests__/window.test.ts +0 -286
- package/src/transforms/aggregate.ts +0 -131
- package/src/transforms/bin.ts +0 -87
- package/src/transforms/calculate.ts +0 -60
- package/src/transforms/conditional.ts +0 -46
- package/src/transforms/filter.ts +0 -122
- package/src/transforms/fold.ts +0 -49
- package/src/transforms/index.ts +0 -60
- package/src/transforms/predicates.ts +0 -123
- package/src/transforms/timeunit.ts +0 -88
- package/src/transforms/window.ts +0 -185
|
@@ -1,488 +0,0 @@
|
|
|
1
|
-
import type { LayoutStrategy, PointMark, Rect } from '@opendata-ai/openchart-core';
|
|
2
|
-
import { describe, expect, it } from 'vitest';
|
|
3
|
-
import type { NormalizedChartSpec } from '../../../compiler/types';
|
|
4
|
-
import { computeScales } from '../../../layout/scales';
|
|
5
|
-
import { computeScatterMarks } from '../compute';
|
|
6
|
-
import { scatterRenderer } from '../index';
|
|
7
|
-
import { computeTrendLine } from '../trendline';
|
|
8
|
-
|
|
9
|
-
// ---------------------------------------------------------------------------
|
|
10
|
-
// Shared fixtures
|
|
11
|
-
// ---------------------------------------------------------------------------
|
|
12
|
-
|
|
13
|
-
const chartArea: Rect = { x: 50, y: 20, width: 500, height: 300 };
|
|
14
|
-
|
|
15
|
-
const fullStrategy: LayoutStrategy = {
|
|
16
|
-
labelMode: 'all',
|
|
17
|
-
legendPosition: 'right',
|
|
18
|
-
annotationPosition: 'inline',
|
|
19
|
-
axisLabelDensity: 'full',
|
|
20
|
-
};
|
|
21
|
-
|
|
22
|
-
function makeBasicScatterSpec(): NormalizedChartSpec {
|
|
23
|
-
return {
|
|
24
|
-
markType: 'point',
|
|
25
|
-
markDef: { type: 'point' },
|
|
26
|
-
data: [
|
|
27
|
-
{ x: 10, y: 20 },
|
|
28
|
-
{ x: 30, y: 50 },
|
|
29
|
-
{ x: 50, y: 40 },
|
|
30
|
-
{ x: 70, y: 80 },
|
|
31
|
-
{ x: 90, y: 60 },
|
|
32
|
-
],
|
|
33
|
-
encoding: {
|
|
34
|
-
x: { field: 'x', type: 'quantitative' },
|
|
35
|
-
y: { field: 'y', type: 'quantitative' },
|
|
36
|
-
},
|
|
37
|
-
chrome: {},
|
|
38
|
-
annotations: [],
|
|
39
|
-
responsive: true,
|
|
40
|
-
theme: {},
|
|
41
|
-
darkMode: 'off',
|
|
42
|
-
labels: { density: 'auto', format: '' },
|
|
43
|
-
};
|
|
44
|
-
}
|
|
45
|
-
|
|
46
|
-
function makeBubbleSpec(): NormalizedChartSpec {
|
|
47
|
-
return {
|
|
48
|
-
markType: 'point',
|
|
49
|
-
markDef: { type: 'point' },
|
|
50
|
-
data: [
|
|
51
|
-
{ gdp: 10, life: 60, population: 1000 },
|
|
52
|
-
{ gdp: 30, life: 70, population: 5000 },
|
|
53
|
-
{ gdp: 50, life: 75, population: 300 },
|
|
54
|
-
{ gdp: 70, life: 80, population: 8000 },
|
|
55
|
-
],
|
|
56
|
-
encoding: {
|
|
57
|
-
x: { field: 'gdp', type: 'quantitative' },
|
|
58
|
-
y: { field: 'life', type: 'quantitative' },
|
|
59
|
-
size: { field: 'population', type: 'quantitative' },
|
|
60
|
-
},
|
|
61
|
-
chrome: {},
|
|
62
|
-
annotations: [],
|
|
63
|
-
responsive: true,
|
|
64
|
-
theme: {},
|
|
65
|
-
darkMode: 'off',
|
|
66
|
-
labels: { density: 'auto', format: '' },
|
|
67
|
-
};
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
function makeColoredScatterSpec(): NormalizedChartSpec {
|
|
71
|
-
return {
|
|
72
|
-
markType: 'point',
|
|
73
|
-
markDef: { type: 'point' },
|
|
74
|
-
data: [
|
|
75
|
-
{ x: 10, y: 20, group: 'A' },
|
|
76
|
-
{ x: 30, y: 50, group: 'A' },
|
|
77
|
-
{ x: 50, y: 40, group: 'B' },
|
|
78
|
-
{ x: 70, y: 80, group: 'B' },
|
|
79
|
-
{ x: 90, y: 60, group: 'C' },
|
|
80
|
-
],
|
|
81
|
-
encoding: {
|
|
82
|
-
x: { field: 'x', type: 'quantitative' },
|
|
83
|
-
y: { field: 'y', type: 'quantitative' },
|
|
84
|
-
color: { field: 'group', type: 'nominal' },
|
|
85
|
-
},
|
|
86
|
-
chrome: {},
|
|
87
|
-
annotations: [],
|
|
88
|
-
responsive: true,
|
|
89
|
-
theme: {},
|
|
90
|
-
darkMode: 'off',
|
|
91
|
-
labels: { density: 'auto', format: '' },
|
|
92
|
-
};
|
|
93
|
-
}
|
|
94
|
-
|
|
95
|
-
// ---------------------------------------------------------------------------
|
|
96
|
-
// computeScatterMarks tests
|
|
97
|
-
// ---------------------------------------------------------------------------
|
|
98
|
-
|
|
99
|
-
describe('computeScatterMarks', () => {
|
|
100
|
-
describe('basic scatter', () => {
|
|
101
|
-
it('produces one PointMark per data row', () => {
|
|
102
|
-
const spec = makeBasicScatterSpec();
|
|
103
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
104
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
105
|
-
|
|
106
|
-
expect(marks).toHaveLength(5);
|
|
107
|
-
expect(marks.every((m) => m.type === 'point')).toBe(true);
|
|
108
|
-
});
|
|
109
|
-
|
|
110
|
-
it('point positions are within chart area bounds', () => {
|
|
111
|
-
const spec = makeBasicScatterSpec();
|
|
112
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
113
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
114
|
-
|
|
115
|
-
for (const mark of marks) {
|
|
116
|
-
expect(mark.cx).toBeGreaterThanOrEqual(chartArea.x);
|
|
117
|
-
expect(mark.cx).toBeLessThanOrEqual(chartArea.x + chartArea.width);
|
|
118
|
-
expect(mark.cy).toBeGreaterThanOrEqual(chartArea.y);
|
|
119
|
-
expect(mark.cy).toBeLessThanOrEqual(chartArea.y + chartArea.height);
|
|
120
|
-
}
|
|
121
|
-
});
|
|
122
|
-
|
|
123
|
-
it('points have default radius when no size encoding', () => {
|
|
124
|
-
const spec = makeBasicScatterSpec();
|
|
125
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
126
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
127
|
-
|
|
128
|
-
for (const mark of marks) {
|
|
129
|
-
expect(mark.r).toBe(5);
|
|
130
|
-
}
|
|
131
|
-
});
|
|
132
|
-
|
|
133
|
-
it('points have partial fill opacity for overlap visibility', () => {
|
|
134
|
-
const spec = makeBasicScatterSpec();
|
|
135
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
136
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
137
|
-
|
|
138
|
-
for (const mark of marks) {
|
|
139
|
-
expect(mark.fillOpacity).toBeGreaterThan(0);
|
|
140
|
-
expect(mark.fillOpacity).toBeLessThan(1);
|
|
141
|
-
}
|
|
142
|
-
});
|
|
143
|
-
|
|
144
|
-
it('each point has an aria label with field values', () => {
|
|
145
|
-
const spec = makeBasicScatterSpec();
|
|
146
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
147
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
148
|
-
|
|
149
|
-
expect(marks[0].aria.label).toContain('x=10');
|
|
150
|
-
expect(marks[0].aria.label).toContain('y=20');
|
|
151
|
-
});
|
|
152
|
-
});
|
|
153
|
-
|
|
154
|
-
describe('bubble variant (size encoding)', () => {
|
|
155
|
-
it('points have varying radii based on size field', () => {
|
|
156
|
-
const spec = makeBubbleSpec();
|
|
157
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
158
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
159
|
-
|
|
160
|
-
const radii = marks.map((m) => m.r);
|
|
161
|
-
const uniqueRadii = new Set(radii);
|
|
162
|
-
expect(uniqueRadii.size).toBeGreaterThan(1);
|
|
163
|
-
});
|
|
164
|
-
|
|
165
|
-
it('larger size values produce larger radii', () => {
|
|
166
|
-
const spec = makeBubbleSpec();
|
|
167
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
168
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
169
|
-
|
|
170
|
-
// population: 8000 should have largest radius
|
|
171
|
-
const largest = marks.find((m) => m.data.population === 8000)!;
|
|
172
|
-
const smallest = marks.find((m) => m.data.population === 300)!;
|
|
173
|
-
expect(largest.r).toBeGreaterThan(smallest.r);
|
|
174
|
-
});
|
|
175
|
-
|
|
176
|
-
it('aria label includes size field', () => {
|
|
177
|
-
const spec = makeBubbleSpec();
|
|
178
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
179
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
180
|
-
|
|
181
|
-
expect(marks[0].aria.label).toContain('population=');
|
|
182
|
-
});
|
|
183
|
-
|
|
184
|
-
it('explicit size domain keeps the largest datum below the max radius', () => {
|
|
185
|
-
const base = makeBubbleSpec();
|
|
186
|
-
// Widen the domain past the data max (8000) so nothing reaches radius 30.
|
|
187
|
-
const spec: NormalizedChartSpec = {
|
|
188
|
-
...base,
|
|
189
|
-
encoding: {
|
|
190
|
-
...base.encoding,
|
|
191
|
-
size: { field: 'population', type: 'quantitative', scale: { domain: [0, 32000] } },
|
|
192
|
-
},
|
|
193
|
-
};
|
|
194
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
195
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
196
|
-
|
|
197
|
-
const largest = marks.find((m) => m.data.population === 8000)!;
|
|
198
|
-
// sqrt(8000/32000) * 30 = 0.5 * 30 = 15, well under the 30px cap.
|
|
199
|
-
expect(largest.r).toBeLessThan(20);
|
|
200
|
-
});
|
|
201
|
-
|
|
202
|
-
it('explicit size range caps the radii', () => {
|
|
203
|
-
const base = makeBubbleSpec();
|
|
204
|
-
const spec: NormalizedChartSpec = {
|
|
205
|
-
...base,
|
|
206
|
-
encoding: {
|
|
207
|
-
...base.encoding,
|
|
208
|
-
size: { field: 'population', type: 'quantitative', scale: { range: [2, 12] } },
|
|
209
|
-
},
|
|
210
|
-
};
|
|
211
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
212
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
213
|
-
|
|
214
|
-
const maxRadius = Math.max(...marks.map((m) => m.r));
|
|
215
|
-
expect(maxRadius).toBeLessThanOrEqual(12);
|
|
216
|
-
});
|
|
217
|
-
});
|
|
218
|
-
|
|
219
|
-
describe('color encoding', () => {
|
|
220
|
-
it('points in different groups have different colors', () => {
|
|
221
|
-
const spec = makeColoredScatterSpec();
|
|
222
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
223
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
224
|
-
|
|
225
|
-
const groupA = marks.find((m) => m.data.group === 'A')!;
|
|
226
|
-
const groupB = marks.find((m) => m.data.group === 'B')!;
|
|
227
|
-
expect(groupA.fill).not.toBe(groupB.fill);
|
|
228
|
-
});
|
|
229
|
-
|
|
230
|
-
it('points in the same group share a color', () => {
|
|
231
|
-
const spec = makeColoredScatterSpec();
|
|
232
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
233
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
234
|
-
|
|
235
|
-
const groupAMarks = marks.filter((m) => m.data.group === 'A');
|
|
236
|
-
expect(groupAMarks[0].fill).toBe(groupAMarks[1].fill);
|
|
237
|
-
});
|
|
238
|
-
});
|
|
239
|
-
|
|
240
|
-
describe('edge cases', () => {
|
|
241
|
-
it('returns empty array when no x encoding', () => {
|
|
242
|
-
const spec: NormalizedChartSpec = {
|
|
243
|
-
markType: 'point',
|
|
244
|
-
markDef: { type: 'point' },
|
|
245
|
-
data: [{ y: 10 }],
|
|
246
|
-
encoding: {
|
|
247
|
-
y: { field: 'y', type: 'quantitative' },
|
|
248
|
-
},
|
|
249
|
-
chrome: {},
|
|
250
|
-
annotations: [],
|
|
251
|
-
responsive: true,
|
|
252
|
-
theme: {},
|
|
253
|
-
darkMode: 'off',
|
|
254
|
-
labels: { density: 'auto', format: '' },
|
|
255
|
-
};
|
|
256
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
257
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
258
|
-
expect(marks).toHaveLength(0);
|
|
259
|
-
});
|
|
260
|
-
|
|
261
|
-
it('skips rows with non-finite values', () => {
|
|
262
|
-
const spec: NormalizedChartSpec = {
|
|
263
|
-
markType: 'point',
|
|
264
|
-
markDef: { type: 'point' },
|
|
265
|
-
data: [
|
|
266
|
-
{ x: 10, y: 20 },
|
|
267
|
-
{ x: NaN, y: 30 },
|
|
268
|
-
{ x: 50, y: 40 },
|
|
269
|
-
],
|
|
270
|
-
encoding: {
|
|
271
|
-
x: { field: 'x', type: 'quantitative' },
|
|
272
|
-
y: { field: 'y', type: 'quantitative' },
|
|
273
|
-
},
|
|
274
|
-
chrome: {},
|
|
275
|
-
annotations: [],
|
|
276
|
-
responsive: true,
|
|
277
|
-
theme: {},
|
|
278
|
-
darkMode: 'off',
|
|
279
|
-
labels: { density: 'auto', format: '' },
|
|
280
|
-
};
|
|
281
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
282
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
283
|
-
expect(marks).toHaveLength(2);
|
|
284
|
-
});
|
|
285
|
-
});
|
|
286
|
-
|
|
287
|
-
describe('nominal y axis', () => {
|
|
288
|
-
function makeNominalYSpec(): NormalizedChartSpec {
|
|
289
|
-
return {
|
|
290
|
-
markType: 'point',
|
|
291
|
-
markDef: { type: 'point' },
|
|
292
|
-
data: [
|
|
293
|
-
{ value: 10, category: 'A' },
|
|
294
|
-
{ value: 30, category: 'B' },
|
|
295
|
-
{ value: 50, category: 'C' },
|
|
296
|
-
],
|
|
297
|
-
encoding: {
|
|
298
|
-
x: { field: 'value', type: 'quantitative' },
|
|
299
|
-
y: { field: 'category', type: 'nominal' },
|
|
300
|
-
},
|
|
301
|
-
chrome: {},
|
|
302
|
-
annotations: [],
|
|
303
|
-
responsive: true,
|
|
304
|
-
theme: {},
|
|
305
|
-
darkMode: 'off',
|
|
306
|
-
labels: { density: 'auto', format: '' },
|
|
307
|
-
};
|
|
308
|
-
}
|
|
309
|
-
|
|
310
|
-
it('produces one PointMark per data row', () => {
|
|
311
|
-
const spec = makeNominalYSpec();
|
|
312
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
313
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
314
|
-
|
|
315
|
-
expect(marks).toHaveLength(3);
|
|
316
|
-
expect(marks.every((m) => m.type === 'point')).toBe(true);
|
|
317
|
-
});
|
|
318
|
-
|
|
319
|
-
it('positions are within chart area bounds', () => {
|
|
320
|
-
const spec = makeNominalYSpec();
|
|
321
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
322
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
323
|
-
|
|
324
|
-
for (const mark of marks) {
|
|
325
|
-
expect(mark.cx).toBeGreaterThanOrEqual(chartArea.x);
|
|
326
|
-
expect(mark.cx).toBeLessThanOrEqual(chartArea.x + chartArea.width);
|
|
327
|
-
expect(mark.cy).toBeGreaterThanOrEqual(chartArea.y);
|
|
328
|
-
expect(mark.cy).toBeLessThanOrEqual(chartArea.y + chartArea.height);
|
|
329
|
-
}
|
|
330
|
-
});
|
|
331
|
-
|
|
332
|
-
it('different categories get different y positions', () => {
|
|
333
|
-
const spec = makeNominalYSpec();
|
|
334
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
335
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
336
|
-
|
|
337
|
-
const yPositions = marks.map((m) => m.cy);
|
|
338
|
-
const uniqueYs = new Set(yPositions);
|
|
339
|
-
expect(uniqueYs.size).toBe(3);
|
|
340
|
-
});
|
|
341
|
-
});
|
|
342
|
-
|
|
343
|
-
describe('temporal x axis', () => {
|
|
344
|
-
it('produces marks for temporal x with quantitative y', () => {
|
|
345
|
-
const spec: NormalizedChartSpec = {
|
|
346
|
-
markType: 'point',
|
|
347
|
-
markDef: { type: 'point' },
|
|
348
|
-
data: [
|
|
349
|
-
{ date: '2020-01-01', value: 10 },
|
|
350
|
-
{ date: '2021-01-01', value: 30 },
|
|
351
|
-
{ date: '2022-01-01', value: 20 },
|
|
352
|
-
],
|
|
353
|
-
encoding: {
|
|
354
|
-
x: { field: 'date', type: 'temporal' },
|
|
355
|
-
y: { field: 'value', type: 'quantitative' },
|
|
356
|
-
},
|
|
357
|
-
chrome: {},
|
|
358
|
-
annotations: [],
|
|
359
|
-
responsive: true,
|
|
360
|
-
theme: {},
|
|
361
|
-
darkMode: 'off',
|
|
362
|
-
labels: { density: 'auto', format: '' },
|
|
363
|
-
};
|
|
364
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
365
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
366
|
-
|
|
367
|
-
expect(marks).toHaveLength(3);
|
|
368
|
-
for (const mark of marks) {
|
|
369
|
-
expect(mark.cx).toBeGreaterThanOrEqual(chartArea.x);
|
|
370
|
-
expect(mark.cx).toBeLessThanOrEqual(chartArea.x + chartArea.width);
|
|
371
|
-
}
|
|
372
|
-
});
|
|
373
|
-
});
|
|
374
|
-
|
|
375
|
-
describe('nominal x axis', () => {
|
|
376
|
-
it('produces marks for nominal x with quantitative y', () => {
|
|
377
|
-
const spec: NormalizedChartSpec = {
|
|
378
|
-
markType: 'point',
|
|
379
|
-
markDef: { type: 'point' },
|
|
380
|
-
data: [
|
|
381
|
-
{ category: 'X', value: 10 },
|
|
382
|
-
{ category: 'Y', value: 30 },
|
|
383
|
-
{ category: 'Z', value: 20 },
|
|
384
|
-
],
|
|
385
|
-
encoding: {
|
|
386
|
-
x: { field: 'category', type: 'nominal' },
|
|
387
|
-
y: { field: 'value', type: 'quantitative' },
|
|
388
|
-
},
|
|
389
|
-
chrome: {},
|
|
390
|
-
annotations: [],
|
|
391
|
-
responsive: true,
|
|
392
|
-
theme: {},
|
|
393
|
-
darkMode: 'off',
|
|
394
|
-
labels: { density: 'auto', format: '' },
|
|
395
|
-
};
|
|
396
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
397
|
-
const marks = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
398
|
-
|
|
399
|
-
expect(marks).toHaveLength(3);
|
|
400
|
-
|
|
401
|
-
// Different categories should produce different x positions
|
|
402
|
-
const xPositions = marks.map((m) => m.cx);
|
|
403
|
-
const uniqueXs = new Set(xPositions);
|
|
404
|
-
expect(uniqueXs.size).toBe(3);
|
|
405
|
-
});
|
|
406
|
-
});
|
|
407
|
-
});
|
|
408
|
-
|
|
409
|
-
// ---------------------------------------------------------------------------
|
|
410
|
-
// computeTrendLine tests
|
|
411
|
-
// ---------------------------------------------------------------------------
|
|
412
|
-
|
|
413
|
-
describe('computeTrendLine', () => {
|
|
414
|
-
it('produces a LineMark with two points', () => {
|
|
415
|
-
const spec = makeBasicScatterSpec();
|
|
416
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
417
|
-
const points = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
418
|
-
const trendLine = computeTrendLine(points);
|
|
419
|
-
|
|
420
|
-
expect(trendLine).not.toBeNull();
|
|
421
|
-
expect(trendLine!.type).toBe('line');
|
|
422
|
-
expect(trendLine!.points).toHaveLength(2);
|
|
423
|
-
});
|
|
424
|
-
|
|
425
|
-
it('trend line spans the full x-range of points', () => {
|
|
426
|
-
const spec = makeBasicScatterSpec();
|
|
427
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
428
|
-
const points = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
429
|
-
const trendLine = computeTrendLine(points);
|
|
430
|
-
|
|
431
|
-
const minCx = Math.min(...points.map((p) => p.cx));
|
|
432
|
-
const maxCx = Math.max(...points.map((p) => p.cx));
|
|
433
|
-
|
|
434
|
-
expect(trendLine!.points[0].x).toBeCloseTo(minCx, 1);
|
|
435
|
-
expect(trendLine!.points[1].x).toBeCloseTo(maxCx, 1);
|
|
436
|
-
});
|
|
437
|
-
|
|
438
|
-
it('trend line is dashed', () => {
|
|
439
|
-
const spec = makeBasicScatterSpec();
|
|
440
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
441
|
-
const points = computeScatterMarks(spec, scales, chartArea, fullStrategy);
|
|
442
|
-
const trendLine = computeTrendLine(points);
|
|
443
|
-
|
|
444
|
-
expect(trendLine!.strokeDasharray).toBeTruthy();
|
|
445
|
-
});
|
|
446
|
-
|
|
447
|
-
it('returns null for fewer than 2 points', () => {
|
|
448
|
-
const singlePoint: PointMark[] = [
|
|
449
|
-
{
|
|
450
|
-
type: 'point',
|
|
451
|
-
cx: 100,
|
|
452
|
-
cy: 100,
|
|
453
|
-
r: 5,
|
|
454
|
-
fill: '#000',
|
|
455
|
-
stroke: '#fff',
|
|
456
|
-
strokeWidth: 1,
|
|
457
|
-
data: {},
|
|
458
|
-
aria: { label: 'test' },
|
|
459
|
-
},
|
|
460
|
-
];
|
|
461
|
-
|
|
462
|
-
expect(computeTrendLine(singlePoint)).toBeNull();
|
|
463
|
-
expect(computeTrendLine([])).toBeNull();
|
|
464
|
-
});
|
|
465
|
-
});
|
|
466
|
-
|
|
467
|
-
describe('trendline opt-out', () => {
|
|
468
|
-
it('renders a trend line by default', () => {
|
|
469
|
-
const spec = makeBasicScatterSpec();
|
|
470
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
471
|
-
const marks = scatterRenderer(spec, scales, chartArea, fullStrategy, undefined as never);
|
|
472
|
-
|
|
473
|
-
expect(marks.some((m) => m.type === 'line')).toBe(true);
|
|
474
|
-
});
|
|
475
|
-
|
|
476
|
-
it('suppresses the trend line when mark.trendline is false', () => {
|
|
477
|
-
const base = makeBasicScatterSpec();
|
|
478
|
-
const spec: NormalizedChartSpec = {
|
|
479
|
-
...base,
|
|
480
|
-
markDef: { type: 'point', trendline: false },
|
|
481
|
-
};
|
|
482
|
-
const scales = computeScales(spec, chartArea, spec.data);
|
|
483
|
-
const marks = scatterRenderer(spec, scales, chartArea, fullStrategy, undefined as never);
|
|
484
|
-
|
|
485
|
-
expect(marks.some((m) => m.type === 'line')).toBe(false);
|
|
486
|
-
expect(marks.every((m) => m.type === 'point')).toBe(true);
|
|
487
|
-
});
|
|
488
|
-
});
|
|
@@ -1,191 +0,0 @@
|
|
|
1
|
-
import type { PointMark } from '@opendata-ai/openchart-core';
|
|
2
|
-
import { describe, expect, it } from 'vitest';
|
|
3
|
-
import { computeTrendLine } from '../trendline';
|
|
4
|
-
|
|
5
|
-
// ---------------------------------------------------------------------------
|
|
6
|
-
// Helpers
|
|
7
|
-
// ---------------------------------------------------------------------------
|
|
8
|
-
|
|
9
|
-
/** Create a PointMark with the given center coordinates. */
|
|
10
|
-
function makePoint(cx: number, cy: number): PointMark {
|
|
11
|
-
return {
|
|
12
|
-
type: 'point',
|
|
13
|
-
cx,
|
|
14
|
-
cy,
|
|
15
|
-
r: 5,
|
|
16
|
-
fill: '#333',
|
|
17
|
-
stroke: '#fff',
|
|
18
|
-
strokeWidth: 1,
|
|
19
|
-
data: {},
|
|
20
|
-
aria: { label: `point at (${cx}, ${cy})` },
|
|
21
|
-
};
|
|
22
|
-
}
|
|
23
|
-
|
|
24
|
-
// ---------------------------------------------------------------------------
|
|
25
|
-
// Tests
|
|
26
|
-
// ---------------------------------------------------------------------------
|
|
27
|
-
|
|
28
|
-
describe('computeTrendLine', () => {
|
|
29
|
-
describe('linear regression computation', () => {
|
|
30
|
-
it('returns a LineMark with two endpoint coordinates', () => {
|
|
31
|
-
const points = [makePoint(100, 200), makePoint(200, 150), makePoint(300, 100)];
|
|
32
|
-
const result = computeTrendLine(points);
|
|
33
|
-
|
|
34
|
-
expect(result).not.toBeNull();
|
|
35
|
-
expect(result!.type).toBe('line');
|
|
36
|
-
expect(result!.points).toHaveLength(2);
|
|
37
|
-
});
|
|
38
|
-
|
|
39
|
-
it('computes correct regression for a perfect positive slope', () => {
|
|
40
|
-
// y = 2x + 10: when x=0,y=10; x=100,y=210; x=200,y=410
|
|
41
|
-
// Note: these are pixel coordinates, not data coordinates
|
|
42
|
-
const points = [makePoint(0, 10), makePoint(100, 210), makePoint(200, 410)];
|
|
43
|
-
const result = computeTrendLine(points)!;
|
|
44
|
-
|
|
45
|
-
// Line spans from x=0 to x=200
|
|
46
|
-
expect(result.points[0].x).toBeCloseTo(0, 1);
|
|
47
|
-
expect(result.points[1].x).toBeCloseTo(200, 1);
|
|
48
|
-
|
|
49
|
-
// y at x=0 should be 10, y at x=200 should be 410
|
|
50
|
-
expect(result.points[0].y).toBeCloseTo(10, 1);
|
|
51
|
-
expect(result.points[1].y).toBeCloseTo(410, 1);
|
|
52
|
-
});
|
|
53
|
-
|
|
54
|
-
it('computes correct regression for a perfect negative slope', () => {
|
|
55
|
-
// y = -x + 300: when x=0,y=300; x=100,y=200; x=200,y=100
|
|
56
|
-
const points = [makePoint(0, 300), makePoint(100, 200), makePoint(200, 100)];
|
|
57
|
-
const result = computeTrendLine(points)!;
|
|
58
|
-
|
|
59
|
-
expect(result.points[0].x).toBeCloseTo(0, 1);
|
|
60
|
-
expect(result.points[0].y).toBeCloseTo(300, 1);
|
|
61
|
-
expect(result.points[1].x).toBeCloseTo(200, 1);
|
|
62
|
-
expect(result.points[1].y).toBeCloseTo(100, 1);
|
|
63
|
-
});
|
|
64
|
-
|
|
65
|
-
it('computes a flat line for horizontal data', () => {
|
|
66
|
-
// All y values are the same
|
|
67
|
-
const points = [makePoint(50, 150), makePoint(150, 150), makePoint(250, 150)];
|
|
68
|
-
const result = computeTrendLine(points)!;
|
|
69
|
-
|
|
70
|
-
expect(result.points[0].y).toBeCloseTo(150, 1);
|
|
71
|
-
expect(result.points[1].y).toBeCloseTo(150, 1);
|
|
72
|
-
});
|
|
73
|
-
|
|
74
|
-
it('spans from minimum to maximum x of input points', () => {
|
|
75
|
-
const points = [makePoint(80, 100), makePoint(250, 200), makePoint(120, 130)];
|
|
76
|
-
const result = computeTrendLine(points)!;
|
|
77
|
-
|
|
78
|
-
expect(result.points[0].x).toBeCloseTo(80, 1);
|
|
79
|
-
expect(result.points[1].x).toBeCloseTo(250, 1);
|
|
80
|
-
});
|
|
81
|
-
|
|
82
|
-
it('fits a noisy dataset with approximate best-fit line', () => {
|
|
83
|
-
// Roughly y = 0.5x + 50, with noise
|
|
84
|
-
const points = [
|
|
85
|
-
makePoint(0, 48),
|
|
86
|
-
makePoint(50, 76),
|
|
87
|
-
makePoint(100, 98),
|
|
88
|
-
makePoint(150, 122),
|
|
89
|
-
makePoint(200, 152),
|
|
90
|
-
];
|
|
91
|
-
const result = computeTrendLine(points)!;
|
|
92
|
-
|
|
93
|
-
// The slope should be approximately 0.5
|
|
94
|
-
const slope =
|
|
95
|
-
(result.points[1].y - result.points[0].y) / (result.points[1].x - result.points[0].x);
|
|
96
|
-
expect(slope).toBeCloseTo(0.5, 0);
|
|
97
|
-
|
|
98
|
-
// Intercept at x=0 should be approximately 50
|
|
99
|
-
expect(result.points[0].y).toBeCloseTo(50, -1); // within 10
|
|
100
|
-
});
|
|
101
|
-
});
|
|
102
|
-
|
|
103
|
-
describe('visual properties', () => {
|
|
104
|
-
it('renders with a dashed stroke pattern', () => {
|
|
105
|
-
const points = [makePoint(100, 200), makePoint(300, 100)];
|
|
106
|
-
const result = computeTrendLine(points)!;
|
|
107
|
-
|
|
108
|
-
expect(result.strokeDasharray).toBe('6 4');
|
|
109
|
-
});
|
|
110
|
-
|
|
111
|
-
it('has a subdued stroke color', () => {
|
|
112
|
-
const points = [makePoint(100, 200), makePoint(300, 100)];
|
|
113
|
-
const result = computeTrendLine(points)!;
|
|
114
|
-
|
|
115
|
-
expect(result.stroke).toBe('#666666');
|
|
116
|
-
});
|
|
117
|
-
|
|
118
|
-
it('has a thin stroke width', () => {
|
|
119
|
-
const points = [makePoint(100, 200), makePoint(300, 100)];
|
|
120
|
-
const result = computeTrendLine(points)!;
|
|
121
|
-
|
|
122
|
-
expect(result.strokeWidth).toBe(1.5);
|
|
123
|
-
});
|
|
124
|
-
|
|
125
|
-
it('has an aria label describing the trend', () => {
|
|
126
|
-
const points = [makePoint(100, 200), makePoint(300, 100)];
|
|
127
|
-
const result = computeTrendLine(points)!;
|
|
128
|
-
|
|
129
|
-
expect(result.aria.label).toContain('Trend line');
|
|
130
|
-
expect(result.aria.label).toContain('linear regression');
|
|
131
|
-
});
|
|
132
|
-
});
|
|
133
|
-
|
|
134
|
-
describe('edge cases', () => {
|
|
135
|
-
it('returns null for an empty array', () => {
|
|
136
|
-
expect(computeTrendLine([])).toBeNull();
|
|
137
|
-
});
|
|
138
|
-
|
|
139
|
-
it('returns null for a single point', () => {
|
|
140
|
-
expect(computeTrendLine([makePoint(100, 200)])).toBeNull();
|
|
141
|
-
});
|
|
142
|
-
|
|
143
|
-
it('handles exactly two points (deterministic line)', () => {
|
|
144
|
-
const points = [makePoint(100, 300), makePoint(400, 150)];
|
|
145
|
-
const result = computeTrendLine(points)!;
|
|
146
|
-
|
|
147
|
-
// With two points, the regression line passes through both
|
|
148
|
-
expect(result.points[0].x).toBeCloseTo(100, 1);
|
|
149
|
-
expect(result.points[0].y).toBeCloseTo(300, 1);
|
|
150
|
-
expect(result.points[1].x).toBeCloseTo(400, 1);
|
|
151
|
-
expect(result.points[1].y).toBeCloseTo(150, 1);
|
|
152
|
-
});
|
|
153
|
-
|
|
154
|
-
it('returns null for vertical data (all same x)', () => {
|
|
155
|
-
// All points have the same x coordinate: denominator in regression is 0
|
|
156
|
-
const points = [makePoint(100, 50), makePoint(100, 150), makePoint(100, 250)];
|
|
157
|
-
const result = computeTrendLine(points);
|
|
158
|
-
|
|
159
|
-
expect(result).toBeNull();
|
|
160
|
-
});
|
|
161
|
-
|
|
162
|
-
it('handles points at the same location gracefully', () => {
|
|
163
|
-
// All points are identical: zero variance in both x and y
|
|
164
|
-
const points = [makePoint(100, 100), makePoint(100, 100)];
|
|
165
|
-
const result = computeTrendLine(points);
|
|
166
|
-
|
|
167
|
-
// Denominator is zero, so regression returns null
|
|
168
|
-
expect(result).toBeNull();
|
|
169
|
-
});
|
|
170
|
-
|
|
171
|
-
it('handles large coordinate values without overflow', () => {
|
|
172
|
-
const points = [makePoint(10000, 50000), makePoint(20000, 60000), makePoint(30000, 70000)];
|
|
173
|
-
const result = computeTrendLine(points)!;
|
|
174
|
-
|
|
175
|
-
expect(result.points[0].x).toBeCloseTo(10000, 0);
|
|
176
|
-
expect(result.points[1].x).toBeCloseTo(30000, 0);
|
|
177
|
-
// Perfect slope = 1
|
|
178
|
-
const slope =
|
|
179
|
-
(result.points[1].y - result.points[0].y) / (result.points[1].x - result.points[0].x);
|
|
180
|
-
expect(slope).toBeCloseTo(1, 5);
|
|
181
|
-
});
|
|
182
|
-
|
|
183
|
-
it('handles negative coordinates', () => {
|
|
184
|
-
const points = [makePoint(-200, -100), makePoint(0, 0), makePoint(200, 100)];
|
|
185
|
-
const result = computeTrendLine(points)!;
|
|
186
|
-
|
|
187
|
-
expect(result.points[0].x).toBeCloseTo(-200, 1);
|
|
188
|
-
expect(result.points[1].x).toBeCloseTo(200, 1);
|
|
189
|
-
});
|
|
190
|
-
});
|
|
191
|
-
});
|