면형상 배치 버그 수정

This commit is contained in:
김민식 2025-02-18 18:18:50 +09:00
parent e7aa5310ef
commit 9c0c741287
3 changed files with 64 additions and 20 deletions

View File

@ -11,23 +11,42 @@ const PlacementSurface = forwardRef((props, refs) => {
const num = ['①', '②', '③', '④', '⑤']
const getImageUrl = () => {
// re_ normal y
const imageName = id < 10 ? '0' + id : id
let imageRotate = 0
if (xInversion && !yInversion) {
return `/static/images/canvas/shape/re_${rotate % 4 !== 0 ? Math.abs(rotate % 4) * 90 + 'deg' : 'normal'}/plane_tab${id < 10 ? '0' + id : id}.svg`
if (rotate % 2 === 0 || rotate < 0) {
imageRotate = Math.abs(rotate % 4)
} else {
if (rotate < 0) {
imageRotate = Math.abs((rotate - 2) % 4)
} else {
imageRotate = Math.abs((rotate + 2) % 4)
}
}
} else if (xInversion && yInversion) {
imageRotate = Math.abs((rotate + 4) % 4)
} else if (xInversion !== yInversion && rotate < 0) {
imageRotate = Math.abs(rotate)
} else if (!xInversion && yInversion) {
if (rotate % 2 === 0 || rotate < 0) {
imageRotate = Math.abs(rotate % 4)
} else {
if (rotate < 0) {
imageRotate = Math.abs((rotate + 2) % 4)
} else {
imageRotate = Math.abs((rotate - 2) % 4)
}
}
} else {
imageRotate = (rotate + 4) % 4
}
if (!xInversion && yInversion) {
return `/static/images/canvas/shape/re_${rotate % 4 !== 0 ? Math.abs(rotate % 4) * 90 + 'deg' : 'normal'}/plane_tab${id < 10 ? '0' + id : id}.svg`
const rotateType = imageRotate % 4 !== 0 ? (imageRotate % 4) * 90 + 'deg' : 'normal'
if (xInversion !== yInversion) {
return `/static/images/canvas/shape/re_${rotateType}/plane_tab${imageName}.svg`
} else {
return `/static/images/canvas/shape/${rotateType}/plane_tab${imageName}.svg`
}
if (xInversion && yInversion) {
return `/static/images/canvas/shape/${rotate % 4 !== 0 ? Math.abs(rotate % 4) * 90 + 'deg' : 'normal'}/plane_tab${id < 10 ? '0' + id : id}.svg`
}
if (rotate < 0) {
return `/static/images/canvas/shape/${rotate !== 0 ? Math.abs((rotate + 4) * 90) + 'deg' : 'normal'}/plane_tab${id < 10 ? '0' + id : id}.svg`
}
return `/static/images/canvas/shape/${rotate !== 0 ? Math.abs(rotate * 90) + 'deg' : 'normal'}/plane_tab${id < 10 ? '0' + id : id}.svg`
}
const azimuthButton = (direction, e) => {

View File

@ -239,12 +239,11 @@ export default function PlacementSurfaceSetting({ id, pos = { x: 50, y: 230 } })
applySurfaceShape(surfaceRefs, selectedType, id)
}
const handleRotate = () => {}
const handleInversion = (type) => {
if (type === 'x') {
const x = xInversion
setXInversion(!xInversion)
setRotate(xInversion ? rotate + 2 : rotate - 2)
setRotate(x ? rotate + 2 : rotate - 2)
// setXInversion(!xInversion)
} else if (type === 'y') {
// setRotate(rotate + 2)
@ -295,6 +294,7 @@ export default function PlacementSurfaceSetting({ id, pos = { x: 50, y: 230 } })
</div>
<div className="shape-library">
<button className="library-btn ico01" onClick={() => setRotate((yInversion !== xInversion ? rotate - 1 : rotate + 1) % 4)}></button>
{/* <button className="library-btn ico01" onClick={() => setRotate((rotate + 1) % 4)}></button> */}
{/* <button className="library-btn ico02" onClick={() => setYInversion(!yInversion)}></button>
<button className="library-btn ico03" onClick={() => setXInversion(!xInversion)}></button> */}
<button className="library-btn ico02" onClick={() => handleInversion('y')}></button>

View File

@ -101,15 +101,40 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
lockScalingX: true, // X 축 크기 조정 잠금
lockScalingY: true, // Y 축 크기 조정 잠금
name: MENU.BATCH_CANVAS.SURFACE_SHAPE_BATCH_TEMP,
flipX: xInversion !== yInversion ? yInversion : false,
flipY: xInversion !== yInversion ? xInversion : false,
angle: xInversion && yInversion ? Math.abs((rotate + 180) % 360) : Math.abs(rotate),
flipX: xInversion !== yInversion,
// angle: xInversion && yInversion ? Math.abs((rotate + 180) % 360) : Math.abs(rotate),
// angle: rotate,
originX: 'center',
originY: 'center',
pitch: globalPitch,
}
obj = new QPolygon(points, options)
let imageRotate = 0
if (xInversion && !yInversion) {
if (rotate % 180 === 0 || rotate < 0) {
imageRotate = Math.abs(rotate % 360)
} else {
imageRotate = Math.abs((rotate - 180) % 4)
}
} else if (xInversion && yInversion) {
imageRotate = Math.abs((rotate + 360) % 360)
} else if (xInversion !== yInversion && rotate < 0) {
imageRotate = Math.abs(rotate)
} else if (!xInversion && yInversion) {
if (rotate % 180 === 0 || rotate < 0) {
imageRotate = Math.abs(rotate % 360)
} else {
if (rotate < 0) {
imageRotate = Math.abs((rotate + 180) % 360)
} else {
imageRotate = Math.abs((rotate - 180) % 360)
}
}
} else {
imageRotate = (rotate + 360) % 360
}
obj.set({ angle: imageRotate })
obj.setCoords() //좌표 변경 적용
canvas?.add(obj)