1export const AnnotationVerticalLineSelector = memo(() => {
2 const vseed: VSeed = {
3 chartType: 'line',
4 dataset: [
5 { date: '2019', profit: 100, sales: 200, count: 500 },
6 { date: '2020', profit: 30, sales: 60, count: 50 },
7 { date: '2021', profit: 30, sales: 60, count: 50 },
8 { date: '2022', profit: 50, sales: 100, count: 50 },
9 { date: '2023', profit: 40, sales: 80, count: 50 },
10 ],
11 annotationVerticalLine: {
12 selector: '2020',
13 text: '下降开始',
14 },
15 dimensions: [{ id: 'date', alias: '日期', location: 'dimension' }],
16 measures: [
17 { id: 'profit', alias: '利润' },
18 { id: 'sales', alias: '销售额' },
19 { id: 'count', alias: '数量' },
20 ],
21 }
22 return <VChartRender vseed={vseed} />
23})
固定的x值, 用于标注垂直线, 类目轴在x方向, 则可输入维值, 数值轴在x方向, 则可输入具体的数值
1export const AnnotationVerticalLineValue = memo(() => {
2 const vseed: VSeed = {
3 chartType: 'area',
4 dataset: [
5 { date: '2019', profit: 100, sales: 200, count: 500 },
6 { date: '2020', profit: 30, sales: 60, count: 50 },
7 { date: '2021', profit: 30, sales: 60, count: 50 },
8 { date: '2022', profit: 50, sales: 100, count: 50 },
9 { date: '2023', profit: 40, sales: 80, count: 50 },
10 ],
11 annotationVerticalLine: {
12 xValue: '2020',
13 text: '下降开始',
14 },
15 dimensions: [{ id: 'date', alias: '日期', location: 'dimension' }],
16 measures: [
17 { id: 'profit', alias: '利润' },
18 { id: 'sales', alias: '销售额' },
19 { id: 'count', alias: '数量' },
20 ],
21 }
22 return <VChartRender vseed={vseed} />
23})