Skip to content

Commit 907351c

Browse files
committed
feat: 允许设置折线图的Y轴范围
1 parent 2ac7f29 commit 907351c

File tree

2 files changed

+62
-2
lines changed

2 files changed

+62
-2
lines changed

src/components/plots/BasicLinePlot.tsx

Lines changed: 30 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { max, mean, median, min, sum } from '@psych/lib'
2-
import { Button, Form, Input, Radio, Select, Space } from 'antd'
2+
import { Button, Form, Input, InputNumber, Radio, Select, Space } from 'antd'
33
import type { EChartsOption } from 'echarts'
44
import * as echarts from 'echarts'
55
import { useId, useState } from 'react'
@@ -38,6 +38,11 @@ type Option = {
3838
smooth: boolean
3939
/** 是否显示数据标签 */
4040
label: boolean
41+
42+
/** 最大 y 值 */
43+
maxY?: number
44+
/** 最小 y 值 */
45+
minY?: number
4146
}
4247

4348
export function BasicLinePlot() {
@@ -66,6 +71,8 @@ export function BasicLinePlot() {
6671
statistic,
6772
smooth,
6873
label,
74+
maxY,
75+
minY,
6976
} = values
7077
const ele = document.getElementById(plotId)
7178
if (!ele) {
@@ -124,6 +131,8 @@ export function BasicLinePlot() {
124131
name: yLabel || dataVar,
125132
nameLocation: 'middle',
126133
nameGap: 35,
134+
max: maxY,
135+
min: minY,
127136
},
128137
series: [
129138
{
@@ -163,6 +172,8 @@ export function BasicLinePlot() {
163172
name: dataLabel || 'Y',
164173
nameLocation: 'middle',
165174
nameGap: 35,
175+
max: maxY,
176+
min: minY,
166177
},
167178
series: [
168179
{
@@ -377,6 +388,24 @@ export function BasicLinePlot() {
377388
</Form.Item>
378389
</Space.Compact>
379390
</Form.Item>
391+
<Form.Item label='Y轴数值范围'>
392+
<Space.Compact className='w-full'>
393+
<Form.Item noStyle name='minY'>
394+
<InputNumber
395+
className='w-full'
396+
addonBefore='Y轴最小为'
397+
placeholder='默认自动'
398+
/>
399+
</Form.Item>
400+
<Form.Item noStyle name='maxY'>
401+
<InputNumber
402+
className='w-full'
403+
addonBefore='Y轴最大为'
404+
placeholder='默认自动'
405+
/>
406+
</Form.Item>
407+
</Space.Compact>
408+
</Form.Item>
380409
<div className='flex flex-row flex-nowrap justify-center items-center gap-4'>
381410
<Button
382411
className='w-full mt-4'

src/components/plots/StackLinePlot.tsx

Lines changed: 32 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
import { max, mean, median, min, sum } from '@psych/lib'
2-
import { Button, Form, Input, Radio, Select, Space } from 'antd'
2+
import { Button, Form, Input, InputNumber, Radio, Select, Space } from 'antd'
33
import type { EChartsOption } from 'echarts'
44
import * as echarts from 'echarts'
55
import { useId, useState } from 'react'
@@ -41,6 +41,11 @@ type Option = {
4141
smooth: boolean
4242
/** 是否显示数据标签 */
4343
label: boolean
44+
45+
/** 最大 y 值 */
46+
maxY?: number
47+
/** 最小 y 值 */
48+
minY?: number
4449
}
4550

4651
export function StackLinePlot() {
@@ -70,6 +75,8 @@ export function StackLinePlot() {
7075
smooth,
7176
label,
7277
stackVar,
78+
maxY,
79+
minY,
7380
} = values
7481
const ele = document.getElementById(plotId)
7582
if (!ele) {
@@ -162,13 +169,17 @@ export function StackLinePlot() {
162169
name: yLabel || dataVar,
163170
nameLocation: 'middle',
164171
nameGap: 35,
172+
max: maxY,
173+
min: minY,
165174
},
166175
series: linesData,
167176
legend: {
168177
data: linesData.map((line) => line.name),
169178
},
170179
}
180+
171181
chart.setOption(option, true)
182+
172183
// 被试内数据处理
173184
} else {
174185
if (!variables?.length) {
@@ -220,6 +231,8 @@ export function StackLinePlot() {
220231
name: dataLabel || 'Y',
221232
nameLocation: 'middle',
222233
nameGap: 35,
234+
max: maxY,
235+
min: minY,
223236
},
224237
series: linesData,
225238
legend: {
@@ -430,6 +443,24 @@ export function StackLinePlot() {
430443
</Form.Item>
431444
</Space.Compact>
432445
</Form.Item>
446+
<Form.Item label='Y轴数值范围'>
447+
<Space.Compact className='w-full'>
448+
<Form.Item noStyle name='minY'>
449+
<InputNumber
450+
className='w-full'
451+
addonBefore='Y轴最小为'
452+
placeholder='默认自动'
453+
/>
454+
</Form.Item>
455+
<Form.Item noStyle name='maxY'>
456+
<InputNumber
457+
className='w-full'
458+
addonBefore='Y轴最大为'
459+
placeholder='默认自动'
460+
/>
461+
</Form.Item>
462+
</Space.Compact>
463+
</Form.Item>
433464
<div className='flex flex-row flex-nowrap justify-center items-center gap-4'>
434465
<Button
435466
className='w-full mt-4'

0 commit comments

Comments
 (0)