diff --git a/labs/lab7/src/chart/components/GroupChart.tsx b/labs/lab7/src/chart/components/GroupChart.tsx
index 363b591..cfd7bfc 100644
--- a/labs/lab7/src/chart/components/GroupChart.tsx
+++ b/labs/lab7/src/chart/components/GroupChart.tsx
@@ -1,4 +1,5 @@
import { BarChart } from '@mui/x-charts/BarChart';
+import { LineChart } from '@mui/x-charts/LineChart';
import Container from '@mui/material/Container';
import type { tGroup } from "../groupdata";
import { useState } from 'react';
@@ -10,6 +11,7 @@ type GroupProps = {
function GroupChart({ data }: GroupProps) {
+ const [isBar, setIsBar] = useState(true);
const [series, setSeries] = useState({
'Максимальная высота': true,
'Средняя высота': false,
@@ -30,7 +32,7 @@ function GroupChart({ data }: GroupProps) {
return (
-
-
+ />}
+ {!isBar &&}
+
)
};
diff --git a/labs/lab7/src/chart/components/SettingChart.tsx b/labs/lab7/src/chart/components/SettingChart.tsx
index 5e0af01..36f239d 100644
--- a/labs/lab7/src/chart/components/SettingChart.tsx
+++ b/labs/lab7/src/chart/components/SettingChart.tsx
@@ -2,6 +2,12 @@ import FormControl from '@mui/material/FormControl';
import FormLabel from '@mui/material/FormLabel';
import FormControlLabel from '@mui/material/FormControlLabel';
import Checkbox from '@mui/material/Checkbox';
+
+import Stack from '@mui/material/Stack';
+import Divider from '@mui/material/Divider';
+import RadioGroup from '@mui/material/RadioGroup';
+import Radio from '@mui/material/Radio';
+import Container from '@mui/material/Container';
type tSeries = {
'Максимальная высота': boolean,
'Средняя высота': boolean,
@@ -9,48 +15,81 @@ type tSeries = {
}
type CheckboxProps = {
series: tSeries;
- setSeries: React.Dispatch<
- React.SetStateAction
- >;
+ setSeries: React.Dispatch>;
+ isBar: boolean;
+ setIsBar: React.Dispatch>
};
-function SettingChart({ series, setSeries }: CheckboxProps) {
+function SettingChart({ series, setSeries, isBar, setIsBar }: CheckboxProps) {
const handleChange = (event: React.ChangeEvent) => {
setSeries({
...series,
[event.target.name]: event.target.checked,
});
};
+
+ const handleRadioButtonChange = (event: React.ChangeEvent) => {
+ setIsBar(event.target.value === "bar");
+ };
return (
-
-
- На диаграмме показать:
-
-
- }
- label="максимальную высоту"
- />
-
- }
- label="среднюю высоту"
- />
-
- }
- label="минимальную высоту"
- />
-
+ }
+ spacing={2}
+ sx={{ m: "20px 0", justifyContent: "center", }}
+ >
+
+
+ Тип диаграммы:
+
+
+
+ }
+ label="Гистограмма"
+ />
+
+ }
+ label="Линейная"
+ />
+
+
+
+
+ На диаграмме показать:
+
+
+ }
+ label="максимальную высоту"
+ />
+
+ }
+ label="среднюю высоту"
+ />
+
+ }
+ label="минимальную высоту"
+ />
+
+
)
}
export default SettingChart;
\ No newline at end of file