Dwinzo-Beta/Dwinzo_Demo
4
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

added screenSizer to line

Browse Source
This commit is contained in:
Jerald-Golden-B
2025-09-15 11:30:02 +05:30
parent b5a7b5c6ff
commit b2ed93abc0
3 changed files with 15 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
app/src/modules/builder/line/line.tsx
View File

@@ -1,6 +1,6 @@
import * as THREE from "three"; import * as THREE from "three";
import { useMemo } from "react"; import { useMemo } from "react";
import { DragControls, Tube } from "@react-three/drei"; import { DragControls, Line as DreiLine } from "@react-three/drei";
import * as Constants from "../../../types/world/worldConstants"; import * as Constants from "../../../types/world/worldConstants";
import { useLineEventHandler } from "./eventHandler/useLineEventHandler"; import { useLineEventHandler } from "./eventHandler/useLineEventHandler";
@@ -14,7 +14,7 @@ function Line({ points }: Readonly<LineProps>) {
const [start, end] = points.map((p) => new THREE.Vector3(...p.position)); const [start, end] = points.map((p) => new THREE.Vector3(...p.position));
return new THREE.LineCurve3(start, end); return new THREE.LineCurve3(start, end);
}, [points]); }, [points]);
const positions = useMemo(() => points.map((p) => new THREE.Vector3(...p.position)), [points]);
const colors = getColor(points[0]); const colors = getColor(points[0]);
function getColor(point: Point) { function getColor(point: Point) {
@@ -50,18 +50,18 @@ function Line({ points }: Readonly<LineProps>) {
return ( return (
<DragControls axisLock="y" autoTransform={false} onDragStart={handleDragStart} onDrag={handleDrag} onDragEnd={handleDragEnd}> <DragControls axisLock="y" autoTransform={false} onDragStart={handleDragStart} onDrag={handleDrag} onDragEnd={handleDragEnd}>
<Tube <DreiLine
name={`${points[0].pointType}-Line`} name={`${points[0].pointType}-Line`}
key={`${points[0].pointUuid}-${points[1].pointUuid}`} key={`${points[0].pointUuid}-${points[1].pointUuid}`}
uuid={`${points[0].pointUuid}-${points[1].pointUuid}`} uuid={`${points[0].pointUuid}-${points[1].pointUuid}`}
userData={{ points, path }} userData={{ points, path }}
args={[path, Constants.lineConfig.tubularSegments, Constants.lineConfig.radius, Constants.lineConfig.radialSegments, false]} points={positions}
lineWidth={7.5}
color={isDeletable ? colors.defaultDeleteColor : colors.defaultLineColor}
onClick={handleLineClick} onClick={handleLineClick}
onPointerOver={handlePointerOver} onPointerOver={handlePointerOver}
onPointerOut={handlePointerOut} onPointerOut={handlePointerOut}
> />
<meshStandardMaterial color={isDeletable ? colors.defaultDeleteColor : colors.defaultLineColor} />
</Tube>
</DragControls> </DragControls>
); );
} }

19
app/src/modules/builder/line/reference/referenceLine.tsx
View File

@@ -1,25 +1,16 @@
import * as THREE from 'three';
import { useMemo } from "react"; import { useMemo } from "react";
import * as Constants from '../../../../types/world/worldConstants'; import * as THREE from "three";
import { Tube } from '@react-three/drei'; import { Line as DreiLine } from "@react-three/drei";
import * as Constants from "../../../../types/world/worldConstants";
interface ReferenceLineProps { interface ReferenceLineProps {
points: [Point, Point]; points: [Point, Point];
} }
function ReferenceLine({ points }: Readonly<ReferenceLineProps>) { function ReferenceLine({ points }: Readonly<ReferenceLineProps>) {
const path = useMemo(() => { const positions = useMemo(() => points.map((p) => new THREE.Vector3(...p.position)), [points]);
const [start, end] = points.map(p => new THREE.Vector3(...p.position));
return new THREE.LineCurve3(start, end);
}, [points]);
return ( return <DreiLine points={positions} lineWidth={7.5} color={Constants.lineConfig.helperColor} />;
<Tube
args={[path, Constants.lineConfig.tubularSegments, Constants.lineConfig.radius, Constants.lineConfig.radialSegments, false]}
>
<meshStandardMaterial color={Constants.lineConfig.helperColor} />
</Tube>
);
} }
export default ReferenceLine; export default ReferenceLine;

2
app/src/types/world/worldConstants.ts
View File

@@ -127,6 +127,7 @@ export type PointConfig = {
export type LineConfig = { export type LineConfig = {
tubularSegments: number; tubularSegments: number;
radius: number; radius: number;
width: number;
radialSegments: number; radialSegments: number;
wallName: string; wallName: string;
floorName: string; floorName: string;
@@ -330,6 +331,7 @@ export const pointConfig: PointConfig = {
export const lineConfig: LineConfig = { export const lineConfig: LineConfig = {
tubularSegments: 64, // Number of tubular segments tubularSegments: 64, // Number of tubular segments
radius: 0.15, // Radius of the lines radius: 0.15, // Radius of the lines
width: 20, // Width of the lines
radialSegments: 8, // Number of radial segments radialSegments: 8, // Number of radial segments
wallName: "WallLine", // Name of the wall lines wallName: "WallLine", // Name of the wall lines
floorName: "FloorLine", // Name of the floor lines floorName: "FloorLine", // Name of the floor lines