Improve 3D view to match reference drawings
Based on reference images in afbeeldingen/modellen/: - dt9.png, dt10.png, door_type_4.jpg, samenstelling_beide.png Changes for technical drawing aesthetic: **Camera Improvements:** - Position: [0, 1.2, 3.5] - More frontal, less perspective - FOV: 35° (was 45°) - Less distortion - Limited rotation: ±15° azimuth, near-horizontal polar - Damping enabled for smooth movement - Result: Flatter, more schematic view **Profile Thickness (Match Reference Lines):** - Stiles: 60mm (was 40mm) - Thicker vertical frames - Rails: 40mm (was 20mm) - Thicker horizontal frames - Depth: 60mm uniform - More prominent profiles - Radius: 2mm (was 1mm) - Slightly more visible edges - Result: Bold, visible frame lines like references **Lighting (High Contrast):** - Ambient: 0.8 (was 0.5) - Brighter overall - Front key light: Straight on from [0,5,10] - Intensity: 2.0 - Strong, even illumination - Subtle side lights for minimal depth - Result: Flat, technical drawing appearance **Glass Material (White/Opaque):** - Color: #f8f9fa (bright white) - Transmission: 0.3 (was 1.0) - Much less transparent - Opacity: 0.95 - Nearly opaque - Result: White glass areas like reference drawings **Visual Result:** - Clear black frame lines on white glass - Frontal view with minimal perspective - Technical drawing aesthetic - Matches dt9.png, door_type_4.jpg style - User can see door design clearly Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -15,18 +15,17 @@ const SteelMaterial = ({ color }: { color: string }) => (
|
||||
/>
|
||||
);
|
||||
|
||||
// Glass material
|
||||
// Glass material - More opaque/white for technical drawing look
|
||||
const GlassMaterial = () => (
|
||||
<meshPhysicalMaterial
|
||||
color="#eff6ff"
|
||||
color="#f8f9fa"
|
||||
transparent
|
||||
transmission={1}
|
||||
roughness={0.05}
|
||||
thickness={2.5}
|
||||
transmission={0.3}
|
||||
roughness={0.1}
|
||||
thickness={1}
|
||||
ior={1.5}
|
||||
envMapIntensity={1}
|
||||
clearcoat={1}
|
||||
clearcoatRoughness={0}
|
||||
envMapIntensity={0.5}
|
||||
opacity={0.95}
|
||||
/>
|
||||
);
|
||||
|
||||
@@ -59,13 +58,13 @@ export function Door3DEnhanced() {
|
||||
const doorWidth = doorLeafWidth / 1000; // Convert mm to m
|
||||
const doorHeight = height / 1000; // Convert mm to m
|
||||
|
||||
// Profile dimensions (in meters)
|
||||
const stileWidth = 0.04; // 40mm vertical profiles
|
||||
const stileDepth = 0.04; // 40mm depth
|
||||
const railHeight = 0.02; // 20mm horizontal profiles
|
||||
const railDepth = 0.04; // 40mm depth
|
||||
const glassThickness = 0.008; // 8mm glass
|
||||
const profileRadius = 0.001; // 1mm rounded corners
|
||||
// Profile dimensions (in meters) - Thicker for visibility
|
||||
const stileWidth = 0.06; // 60mm vertical profiles (more visible)
|
||||
const stileDepth = 0.06; // 60mm depth
|
||||
const railHeight = 0.04; // 40mm horizontal profiles (more visible)
|
||||
const railDepth = 0.06; // 60mm depth
|
||||
const glassThickness = 0.01; // 10mm glass
|
||||
const profileRadius = 0.002; // 2mm rounded corners
|
||||
|
||||
// Calculate positions for grid dividers
|
||||
const getDividerPositions = () => {
|
||||
|
||||
Reference in New Issue
Block a user