RC1
This commit is contained in:
parent
af1cefc71c
commit
61912545e6
@ -147,6 +147,15 @@ const FormComponent = <T extends Drone | BaseStation>({ entity, onUpdate }: Form
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
{"speed" in formData && (<div className="mb-4">
|
||||||
|
<label className="block mb-1 text-sm font-medium">Speed:</label>
|
||||||
|
<input
|
||||||
|
className="w-full p-2 bg-gray-800 border border-gray-600 rounded focus:outline-none focus:border-blue-500"
|
||||||
|
type="number"
|
||||||
|
value={formData.speed}
|
||||||
|
onChange={(e) => handleInputChange('signalRadius', +e.target.value)}
|
||||||
|
/>
|
||||||
|
</div>)}
|
||||||
</form>
|
</form>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -7,16 +7,16 @@ import { SimDrone } from "../Threejs/Models"
|
|||||||
// UAV?: SimDrone[] // беспилотные аппараты - DTO
|
// UAV?: SimDrone[] // беспилотные аппараты - DTO
|
||||||
// }
|
// }
|
||||||
|
|
||||||
export interface Drone {
|
export interface DroneSim {
|
||||||
connected_to: string | null;
|
connected_to: string | null;
|
||||||
frequency: number;
|
frequency: number;
|
||||||
name: string;
|
name: string;
|
||||||
position: [number, number, number];
|
position: [number, number, number];
|
||||||
rssi: number | null;
|
rssi: number | undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface IPlayerSimulationPart {
|
export interface IPlayerSimulationPart {
|
||||||
[key: string]: {
|
[key: string]: {
|
||||||
[droneName: string]: Drone;
|
[droneName: string]: DroneSim;
|
||||||
};
|
};
|
||||||
}
|
}
|
||||||
|
@ -1,9 +1,9 @@
|
|||||||
"use client";
|
"use client";
|
||||||
import { Canvas } from '@react-three/fiber';
|
import { Canvas } from '@react-three/fiber';
|
||||||
import { OrbitControls, useGLTF, Line, Text } from '@react-three/drei';
|
import { OrbitControls, useGLTF, Line, Text, Box } from '@react-three/drei';
|
||||||
import React, { useState, useEffect, useRef } from 'react';
|
import React, { useState, useEffect, useRef } from 'react';
|
||||||
import { Drone, BaseStation, SimDrone } from '../Threejs/Models';
|
import { Drone, BaseStation, SimDrone } from '../Threejs/Models';
|
||||||
import { IPlayerSimulationPart } from './Model';
|
import { DroneSim, IPlayerSimulationPart } from './Model';
|
||||||
|
|
||||||
|
|
||||||
interface Player {
|
interface Player {
|
||||||
@ -150,29 +150,17 @@ interface IPlayerTsInstance {
|
|||||||
TimestampEnd?: number
|
TimestampEnd?: number
|
||||||
TimestampStep?: number
|
TimestampStep?: number
|
||||||
Simulations?: IPlayerSimulationPart
|
Simulations?: IPlayerSimulationPart
|
||||||
//// IPlayerSimulationPart - часть симуляции
|
BaseStations?: BaseStation[]
|
||||||
// interface Drone {
|
|
||||||
// connected_to: string | null;
|
|
||||||
// frequency: number;
|
|
||||||
// name: string;
|
|
||||||
// position: [number, number, number];
|
|
||||||
// rssi: number | null;
|
|
||||||
// }
|
|
||||||
|
|
||||||
// interface IPlayerSimulationPart {
|
|
||||||
// [key: string]: {
|
|
||||||
// [droneName: string]: Drone;
|
|
||||||
// };
|
|
||||||
// }
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const PlayerTsInstance: React.FC<IPlayerTsInstance> = ({
|
const PlayerTsInstance: React.FC<IPlayerTsInstance> = ({
|
||||||
TimestampEnd = 299, // Конечная временная метка
|
TimestampEnd = 299, // Конечная временная метка
|
||||||
TimestampStep = 1, // Шаг временной метки
|
TimestampStep = 1, // Шаг временной метки
|
||||||
Simulations,
|
Simulations,
|
||||||
|
BaseStations,
|
||||||
}) => {
|
}) => {
|
||||||
const [currentTimestamp, setCurrentTimestamp] = useState(0);
|
const [currentTimestamp, setCurrentTimestamp] = useState(0);
|
||||||
const [drones, setDrones] = useState<Drone[]>([]);
|
const [drones, setDrones] = useState<DroneSim[]>([]);
|
||||||
const [baseStations, setBaseStations] = useState<BaseStation[]>([]);
|
const [baseStations, setBaseStations] = useState<BaseStation[]>([]);
|
||||||
const [isPlaying, setIsPlaying] = useState(false); // Флаг для управления анимацией
|
const [isPlaying, setIsPlaying] = useState(false); // Флаг для управления анимацией
|
||||||
|
|
||||||
@ -252,6 +240,7 @@ const PlayerTsInstance: React.FC<IPlayerTsInstance> = ({
|
|||||||
<DroneModel
|
<DroneModel
|
||||||
key={drone.name}
|
key={drone.name}
|
||||||
position={drone.position}
|
position={drone.position}
|
||||||
|
rssi={drone.rssi}
|
||||||
droneName={drone.name}
|
droneName={drone.name}
|
||||||
/>
|
/>
|
||||||
))}
|
))}
|
||||||
@ -280,7 +269,7 @@ const MapModel = () => {
|
|||||||
return <primitive object={scene} scale={[2, 2, 2]} />;
|
return <primitive object={scene} scale={[2, 2, 2]} />;
|
||||||
};
|
};
|
||||||
// Модель дрона
|
// Модель дрона
|
||||||
const DroneModel = ({ position, droneName, onClick, isSelected }: { position: [number, number, number]; droneName?: string; onClick: () => void; isSelected: boolean }) => {
|
const DroneModel = ({ position, droneName, rssi, onClick, isSelected }: { position: [number, number, number]; droneName?: string; rssi?: number, onClick: () => void; isSelected: boolean }) => {
|
||||||
const { scene } = useGLTF('/objects/drone.glb');
|
const { scene } = useGLTF('/objects/drone.glb');
|
||||||
return (
|
return (
|
||||||
<group onClick={onClick}>
|
<group onClick={onClick}>
|
||||||
@ -295,16 +284,23 @@ const DroneModel = ({ position, droneName, onClick, isSelected }: { position: [n
|
|||||||
>
|
>
|
||||||
{droneName}
|
{droneName}
|
||||||
</Text >
|
</Text >
|
||||||
|
<Text
|
||||||
|
position={[position[0], position[1] + 6, position[2]]} // Позиционируем текст над дроном
|
||||||
|
fontSize={1}
|
||||||
|
color="yellow" // Цвет текста
|
||||||
|
anchorX="center" // Центровка текста по X
|
||||||
|
anchorY="middle" // Центровка текста по Y
|
||||||
|
>
|
||||||
|
RSSI {rssi}
|
||||||
|
</Text >
|
||||||
{isSelected && (
|
{isSelected && (
|
||||||
<mesh position={position}>
|
<mesh position={position}>
|
||||||
<sphereGeometry args={[1, 16, 16]} />
|
<sphereGeometry args={[1, 16, 16]} />
|
||||||
<meshBasicMaterial color="red" wireframe />
|
<meshBasicMaterial color="red" wireframe />
|
||||||
</mesh>
|
</mesh>)}
|
||||||
)}
|
<Box position={position}>
|
||||||
<mesh position={position}>
|
<meshBasicMaterial color="green" wireframe />
|
||||||
<sphereGeometry args={[1, 16, 16]} />
|
</Box>
|
||||||
<meshBasicMaterial color="red" wireframe />
|
|
||||||
</mesh>
|
|
||||||
</group>
|
</group>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
@ -4,6 +4,7 @@ export interface Drone {
|
|||||||
position: [number, number, number];
|
position: [number, number, number];
|
||||||
frequency: number;
|
frequency: number;
|
||||||
signalRadius: number;
|
signalRadius: number;
|
||||||
|
speed: number
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface BaseStation {
|
export interface BaseStation {
|
||||||
|
@ -45,6 +45,7 @@ const ThreeJsInstance : React.FC<IThreeJsInstance> = ({Click}) => {
|
|||||||
position: [Math.random() * 10, 5, Math.random() * 10],
|
position: [Math.random() * 10, 5, Math.random() * 10],
|
||||||
frequency: Math.random() * 100 + 400, // Example frequency range between 400-500
|
frequency: Math.random() * 100 + 400, // Example frequency range between 400-500
|
||||||
signalRadius: Math.random() * 5 + 5, // Example signal radius between 5-10
|
signalRadius: Math.random() * 5 + 5, // Example signal radius between 5-10
|
||||||
|
speed: 1,
|
||||||
},
|
},
|
||||||
]);
|
]);
|
||||||
};
|
};
|
||||||
|
Loading…
Reference in New Issue
Block a user