feat: improve zone name positioning in ZoneGroup based on polygon center and average height
This commit is contained in:
parent
068af3f936
commit
74c1562c3c
|
@ -576,24 +576,50 @@ const ZoneGroup: React.FC = () => {
|
|||
</mesh>
|
||||
);
|
||||
})}
|
||||
{!toggleView && (
|
||||
<Html
|
||||
// data
|
||||
key={zone.zoneId}
|
||||
position={[
|
||||
zone.viewPortCenter[0],
|
||||
zone.viewPortCenter[1] + 4,
|
||||
zone.viewPortCenter[2],
|
||||
]}
|
||||
// class
|
||||
className="zone-name-wrapper"
|
||||
// other
|
||||
center
|
||||
distanceFactor={20}
|
||||
>
|
||||
<div className="zone-name">{zone.zoneName}</div>
|
||||
</Html>
|
||||
)}
|
||||
{!toggleView &&
|
||||
(() => {
|
||||
const points3D = zone.points || [];
|
||||
const coords2D = points3D.map((p: any) => [p[0], p[2]]);
|
||||
|
||||
// Ensure the polygon is closed
|
||||
if (
|
||||
coords2D.length >= 3 &&
|
||||
(coords2D[0][0] !== coords2D[coords2D.length - 1][0] ||
|
||||
coords2D[0][1] !== coords2D[coords2D.length - 1][1])
|
||||
) {
|
||||
coords2D.push(coords2D[0]);
|
||||
}
|
||||
|
||||
const polygon = turf.polygon([coords2D]);
|
||||
const center2D = turf.center(polygon).geometry.coordinates;
|
||||
|
||||
// Calculate the average Y value
|
||||
const sumY = points3D.reduce(
|
||||
(sum: number, p: any) => sum + p[1],
|
||||
0
|
||||
);
|
||||
const avgY = points3D.length > 0 ? sumY / points3D.length : 0;
|
||||
|
||||
const htmlPosition: [number, number, number] = [
|
||||
center2D[0],
|
||||
avgY + (CONSTANTS.zoneConfig.height || 0) + 1.5,
|
||||
center2D[1],
|
||||
];
|
||||
|
||||
return (
|
||||
<Html
|
||||
// data
|
||||
key={zone.zoneId}
|
||||
position={htmlPosition}
|
||||
// class
|
||||
className="zone-name-wrapper"
|
||||
// others
|
||||
center
|
||||
>
|
||||
<div className="zone-name">{zone.zoneName}</div>
|
||||
</Html>
|
||||
);
|
||||
})()}
|
||||
</group>
|
||||
))}
|
||||
</group>
|
||||
|
|
Loading…
Reference in New Issue