diff --git a/labs/lab7/src/chart/Chart.tsx b/labs/lab7/src/chart/Chart.tsx
index 3dac3fb..714b1c4 100644
--- a/labs/lab7/src/chart/Chart.tsx
+++ b/labs/lab7/src/chart/Chart.tsx
@@ -9,6 +9,7 @@ import FormControl from '@mui/material/FormControl';
import * as React from 'react';
import {years, countries, types } from "./groupdata";
import GroupGrid from "./components/GroupGrid";
+import GroupChart from "./components/GroupChart";
type tSelect = "Страна" | "Год" | "Тип";
@@ -40,6 +41,7 @@ function Chart() {
+
>
diff --git a/labs/lab7/src/chart/components/GroupChart.tsx b/labs/lab7/src/chart/components/GroupChart.tsx
new file mode 100644
index 0000000..363b591
--- /dev/null
+++ b/labs/lab7/src/chart/components/GroupChart.tsx
@@ -0,0 +1,49 @@
+import { BarChart } from '@mui/x-charts/BarChart';
+import Container from '@mui/material/Container';
+import type { tGroup } from "../groupdata";
+import { useState } from 'react';
+import SettingChart from "./SettingChart";
+
+type GroupProps = {
+ data: tGroup;
+};
+
+
+function GroupChart({ data }: GroupProps) {
+ const [series, setSeries] = useState({
+ 'Максимальная высота': true,
+ 'Средняя высота': false,
+ 'Минимальная высота': false,
+ });
+ let seriesY = Object.entries(series)
+ .filter(item => item[1] == true)
+ .map(item => {
+ return {
+ "dataKey": item[0], "label": item[0], barLabel: Object.entries(series)
+ .filter(item => item[1] == true).length == 1 ? "value" : ""
+ }
+ });
+ const chartSetting = {
+ yAxis: [{ label: 'Высота (м)' }],
+ height: 400,
+ };
+
+ return (
+
+
+
+
+ )
+};
+
+export default GroupChart;
\ No newline at end of file
diff --git a/labs/lab7/src/chart/components/SettingChart.tsx b/labs/lab7/src/chart/components/SettingChart.tsx
new file mode 100644
index 0000000..5e0af01
--- /dev/null
+++ b/labs/lab7/src/chart/components/SettingChart.tsx
@@ -0,0 +1,56 @@
+import FormControl from '@mui/material/FormControl';
+import FormLabel from '@mui/material/FormLabel';
+import FormControlLabel from '@mui/material/FormControlLabel';
+import Checkbox from '@mui/material/Checkbox';
+type tSeries = {
+ 'Максимальная высота': boolean,
+ 'Средняя высота': boolean,
+ 'Минимальная высота': boolean,
+}
+type CheckboxProps = {
+ series: tSeries;
+ setSeries: React.Dispatch<
+ React.SetStateAction
+ >;
+};
+
+function SettingChart({ series, setSeries }: CheckboxProps) {
+ const handleChange = (event: React.ChangeEvent) => {
+ setSeries({
+ ...series,
+ [event.target.name]: event.target.checked,
+ });
+ };
+ return (
+
+
+ На диаграмме показать:
+
+
+ }
+ label="максимальную высоту"
+ />
+
+ }
+ label="среднюю высоту"
+ />
+
+ }
+ label="минимальную высоту"
+ />
+
+ )
+}
+export default SettingChart;
\ No newline at end of file