Render curved wall measurements along the wall
This commit is contained in:
+20
-1
@@ -12,6 +12,8 @@ const FLOORPLAN_MEASUREMENT_END_TICK = 0.18
|
||||
export type LinearMeasurementOverlay = {
|
||||
dashedExtensions?: boolean
|
||||
id: string
|
||||
dimensionPathEnd?: string | null
|
||||
dimensionPathStart?: string | null
|
||||
dimensionLineEnd: { x1: number; y1: number; x2: number; y2: number }
|
||||
dimensionLineStart: { x1: number; y1: number; x2: number; y2: number }
|
||||
extensionStart: { x1: number; y1: number; x2: number; y2: number }
|
||||
@@ -34,6 +36,7 @@ type FloorplanMeasurementPalette = {
|
||||
type FloorplanMeasurementLineProps = {
|
||||
palette: FloorplanMeasurementPalette
|
||||
segment: { x1: number; y1: number; x2: number; y2: number }
|
||||
path?: string | null
|
||||
isSelected?: boolean
|
||||
dashed?: boolean
|
||||
stroke?: string
|
||||
@@ -42,6 +45,7 @@ type FloorplanMeasurementLineProps = {
|
||||
function FloorplanMeasurementLine({
|
||||
palette,
|
||||
segment,
|
||||
path,
|
||||
isSelected,
|
||||
dashed = false,
|
||||
stroke,
|
||||
@@ -50,7 +54,20 @@ function FloorplanMeasurementLine({
|
||||
? FLOORPLAN_MEASUREMENT_LINE_OPACITY
|
||||
: FLOORPLAN_MEASUREMENT_LINE_OPACITY * 0.4
|
||||
|
||||
return (
|
||||
return path ? (
|
||||
<path
|
||||
d={path}
|
||||
fill="none"
|
||||
shapeRendering="geometricPrecision"
|
||||
stroke={stroke ?? palette.measurementStroke}
|
||||
strokeDasharray={dashed ? FLOORPLAN_MEASUREMENT_EXTENSION_DASH : undefined}
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
strokeOpacity={lineOpacity}
|
||||
strokeWidth={FLOORPLAN_MEASUREMENT_LINE_WIDTH}
|
||||
vectorEffect="non-scaling-stroke"
|
||||
/>
|
||||
) : (
|
||||
<line
|
||||
shapeRendering="geometricPrecision"
|
||||
stroke={stroke ?? palette.measurementStroke}
|
||||
@@ -141,12 +158,14 @@ export const FloorplanMeasurementsLayer = memo(function FloorplanMeasurementsLay
|
||||
<FloorplanMeasurementLine
|
||||
isSelected={measurement.isSelected}
|
||||
palette={palette}
|
||||
path={measurement.dimensionPathStart}
|
||||
segment={measurement.dimensionLineStart}
|
||||
stroke={measurement.stroke}
|
||||
/>
|
||||
<FloorplanMeasurementLine
|
||||
isSelected={measurement.isSelected}
|
||||
palette={palette}
|
||||
path={measurement.dimensionPathEnd}
|
||||
segment={measurement.dimensionLineEnd}
|
||||
stroke={measurement.stroke}
|
||||
/>
|
||||
|
||||
@@ -13,7 +13,7 @@ const TYPE_DEFAULTS: Record<string, NodeDisplay> = {
|
||||
slab: { icon: '/icons/floor.png', label: 'Slab' },
|
||||
ceiling: { icon: '/icons/ceiling.png', label: 'Ceiling' },
|
||||
column: { icon: '/icons/column.png', label: 'Column' },
|
||||
elevator: { icon: '/icons/elevator.svg', label: 'Elevator' },
|
||||
elevator: { icon: '/icons/elevator.png', label: 'Elevator' },
|
||||
fence: { icon: '/icons/fence.png', label: 'Fence' },
|
||||
roof: { icon: '/icons/roof.png', label: 'Roof' },
|
||||
'roof-segment': { icon: '/icons/roof.png', label: 'Roof segment' },
|
||||
|
||||
@@ -49,7 +49,7 @@ export const ElevatorTreeNode = memo(function ElevatorTreeNode({
|
||||
expanded={false}
|
||||
hasChildren={false}
|
||||
icon={
|
||||
<Image alt="" className="object-contain" height={14} src="/icons/elevator.svg" width={14} />
|
||||
<Image alt="" className="object-contain" height={14} src="/icons/elevator.png" width={14} />
|
||||
}
|
||||
isHovered={isHovered}
|
||||
isLast={isLast}
|
||||
|
||||
@@ -474,7 +474,7 @@ export default function ElevatorPanel() {
|
||||
|
||||
return (
|
||||
<PanelWrapper
|
||||
icon="/icons/elevator.svg"
|
||||
icon="/icons/elevator.png"
|
||||
onClose={handleClose}
|
||||
title={node.name || 'Elevator'}
|
||||
width={300}
|
||||
|
||||
Reference in New Issue
Block a user