Skip to content

Commit 14cf110

Browse files
authored
Merge pull request #263 from zjyhhhher/test/add-test-getChartSpecWithContext-BasicHeatMap
test: add test case of getChartSpecWithContext when chartType is BasicHeatMap
2 parents 0efaefa + 0a2d01a commit 14cf110

1 file changed

Lines changed: 212 additions & 0 deletions

File tree

Lines changed: 212 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,212 @@
1+
import { Dict } from '@visactor/vutils';
2+
import { getChartSpecWithContext } from '../../src/atom/chartGenerator/spec';
3+
import type { GenerateChartCellContext } from '../../src/atom/chartGenerator/type';
4+
import { ChartType } from '../../src/types';
5+
import { BASIC_HEAT_MAP_COLOR_THEMES } from '../../src/atom/chartGenerator/spec/constants';
6+
import { builtinThemeMap } from '../../src/atom/chartGenerator/const';
7+
import { BuiltinThemeType } from '../../src/atom/chartGenerator/const';
8+
import { COLOR_THEMES } from '../../src/atom/chartGenerator/spec/constants';
9+
10+
const CHART_TYPE_LIST = [
11+
'Bar Chart',
12+
'Line Chart',
13+
'Area Chart',
14+
'Pie Chart',
15+
'Scatter Plot',
16+
'Word Cloud',
17+
'Rose Chart',
18+
'Radar Chart',
19+
'Sankey Chart',
20+
'Funnel Chart',
21+
'Dual Axis Chart',
22+
'Waterfall Chart',
23+
'Box Plot',
24+
'Linear Progress chart',
25+
'Circular Progress chart',
26+
'Liquid Chart',
27+
'Bubble Circle Packing',
28+
'Map Chart',
29+
'Range Column Chart',
30+
'Sunburst Chart',
31+
'Treemap Chart',
32+
'Gauge Chart',
33+
'Basic Heat Map',
34+
'Venn Chart',
35+
'Dynamic Bar Chart'
36+
];
37+
38+
const items = [
39+
'Asset Liability Ratio',
40+
'Asset Liability Ratio (Deducting Advance Payments)',
41+
'Debt-to-long Capital Ratio',
42+
'Long Term Asset Suitability Ratio',
43+
'Equity Multiplier',
44+
'Equity Ratio of Current Liability',
45+
'Interest Bearing Debt / Fully Invested Capital',
46+
'Current Liability / Total Liabilities',
47+
'Capital Fixation Ratio',
48+
'Expected Default Frequency'
49+
];
50+
const rawData = [
51+
1.0, 0.594527, 0.492963, -0.160995, 0.723664, 0.658646, -0.857474, 0.320706, -0.284634, -0.091423, 0.594527, 1.0,
52+
0.724546, -0.099318, 0.540639, 0.49214, -0.554039, 0.17127, -0.265259, 0.068577, 0.492963, 0.724546, 1.0, -0.091338,
53+
0.450542, 0.375839, -0.524955, 0.300627, -0.198362, 0.033209, -0.160995, -0.099318, -0.091338, 1.0, -0.049872,
54+
-0.028452, 0.157157, 0.009742, -0.162374, 0.155095, 0.723664, 0.540639, 0.450542, -0.049872, 1.0, 0.951933, -0.651767,
55+
0.079052, -0.535984, 0.00798, 0.658646, 0.49214, 0.375839, -0.028452, 0.951933, 1.0, -0.543147, -0.106139, -0.52232,
56+
0.011466, -0.857474, -0.554039, -0.524955, 0.157157, -0.651767, -0.543147, 1.0, -0.595016, 0.310521, 0.066397,
57+
0.320706, 0.17127, 0.300627, 0.009742, 0.079052, -0.106139, -0.595016, 1.0, -0.105199, -0.064886, -0.284634,
58+
-0.265259, -0.198362, -0.162374, -0.535984, -0.52232, 0.310521, -0.105199, 1.0, -0.080153, -0.091423, 0.068577,
59+
0.033209, 0.155095, 0.00798, 0.011466, 0.066397, -0.064886, -0.080153, 1.0
60+
];
61+
interface DataPoint {
62+
var1: string;
63+
var2: string;
64+
value: number;
65+
}
66+
const data: DataPoint[] = [];
67+
for (let i = 0; i < items.length; i++) {
68+
for (let j = 0; j < items.length; j++) {
69+
data.push({
70+
var1: items[i],
71+
var2: items[j],
72+
value: rawData[i * items.length + j]
73+
});
74+
}
75+
}
76+
77+
describe('getChartSpecWithContext', () => {
78+
const baseContext = {
79+
chartTypeList: CHART_TYPE_LIST,
80+
cell: { x: 'var1', y: 'var2', size: 'value' },
81+
dataTable: data,
82+
chartType: ChartType.BasicHeatMap.toUpperCase(),
83+
totalTime: 5
84+
};
85+
86+
// test for `basicHeatMapColor`
87+
it('should generate correct linear color scale for heatmap', () => {
88+
const context = { ...baseContext };
89+
const result = getChartSpecWithContext(context);
90+
91+
expect(result.spec.color).toEqual({
92+
type: 'linear',
93+
domain: [
94+
{
95+
dataId: 'data',
96+
fields: [context.cell.size]
97+
}
98+
],
99+
range: BASIC_HEAT_MAP_COLOR_THEMES
100+
});
101+
});
102+
103+
// test for `basicHeatMapSeries`
104+
it('should generate correct series dimension for heatmap', () => {
105+
const context = { ...baseContext };
106+
const result = getChartSpecWithContext(context);
107+
108+
expect(result.spec.series[0]).toEqual({
109+
type: 'heatmap',
110+
regionId: 'region0',
111+
xField: context.cell.x,
112+
yField: context.cell.y,
113+
valueField: context.cell.size,
114+
cell: {
115+
style: {
116+
fill: {
117+
field: context.cell.size,
118+
scale: 'color'
119+
}
120+
}
121+
}
122+
});
123+
});
124+
125+
// test for `basicHeatMapRegion`
126+
it('should generate correct region dimensions for heatmap', () => {
127+
const context = { ...baseContext };
128+
const result = getChartSpecWithContext(context);
129+
130+
expect(result.spec.region).toEqual([
131+
{
132+
id: 'region0',
133+
width: 200,
134+
height: 200,
135+
padding: { top: 40 }
136+
}
137+
]);
138+
});
139+
140+
// test for `basicHeatMapAxes`
141+
it('should generate axes with correct rotation and dimensions', () => {
142+
const context = { ...baseContext };
143+
const result = getChartSpecWithContext(context);
144+
145+
expect(result.spec.axes[0]).toMatchObject({
146+
orient: 'bottom',
147+
type: 'band',
148+
label: {
149+
space: 10,
150+
style: {
151+
textAlign: 'left',
152+
textBaseline: 'middle',
153+
angle: 90,
154+
fontSize: 8
155+
}
156+
},
157+
height: expect.any(Function)
158+
});
159+
160+
expect(result.spec.axes[1]).toMatchObject({
161+
orient: 'left',
162+
type: 'band',
163+
grid: { visible: false },
164+
domainLine: { visible: false },
165+
label: { space: 10, style: { fontSize: 8 } },
166+
bandPadding: 0
167+
});
168+
169+
const heightFunc = result.spec.axes[0].height;
170+
expect(heightFunc({ height: 400 })).toBe(400 - 314);
171+
});
172+
173+
// test for `basicHeatMapLegend`
174+
it('should position legend on the right for heatmap', () => {
175+
const context = { ...baseContext };
176+
const result = getChartSpecWithContext(context);
177+
178+
expect(result.spec.legends).toEqual({
179+
visible: true,
180+
orient: 'right',
181+
position: 'start',
182+
type: 'color',
183+
field: 'value'
184+
});
185+
});
186+
187+
it('should handle missing cell fields gracefully', () => {
188+
const context = {
189+
chartTypeList: CHART_TYPE_LIST,
190+
cell: {},
191+
dataTable: data,
192+
chartType: ChartType.BasicHeatMap.toUpperCase()
193+
};
194+
195+
const result = getChartSpecWithContext(context);
196+
expect(result.spec).toBeDefined();
197+
expect(result.spec.type).toBe('heatmap');
198+
});
199+
200+
it('should handle missing dataTable fields gracefully', () => {
201+
const context = {
202+
chartTypeList: CHART_TYPE_LIST,
203+
cell: { x: 'var1', y: 'var2', size: 'value' },
204+
dataTable: [{}],
205+
chartType: ChartType.BasicHeatMap.toUpperCase()
206+
};
207+
208+
const result = getChartSpecWithContext(context);
209+
expect(result.spec).toBeDefined();
210+
expect(result.spec.type).toBe('heatmap');
211+
});
212+
});

0 commit comments

Comments
 (0)