방위 범위입력 추가

This commit is contained in:
minsik 2024-10-24 17:58:36 +09:00
parent a250507ab9
commit a41fe47387

View File

@ -6,6 +6,19 @@ export default function Orientation({ setTabNum }) {
const [compasDeg, setCompasDeg] = useState(0)
const [hasAnglePassivity, setHasAnglePassivity] = useState(false)
const getDegree = (degree) => {
if (degree % 15 === 0) return degree
let value = Math.floor(degree / 15)
const remain = ((degree / 15) % 1).toFixed(5)
if (remain > 0.4) {
value++
}
return value * 15
}
return (
<>
<div className="properties-setting-wrap">
@ -18,7 +31,7 @@ export default function Orientation({ setTabNum }) {
{Array.from({ length: 180 / 15 }).map((dot, index) => (
<div
key={index}
className={`circle ${compasDeg === 15 * (12 + index) ? 'act' : ''}`}
className={`circle ${getDegree(compasDeg) === 15 * (12 + index) ? 'act' : ''}`}
onClick={() => setCompasDeg(15 * (12 + index))}
>
{index === 0 && <i>180°</i>}
@ -26,13 +39,13 @@ export default function Orientation({ setTabNum }) {
</div>
))}
{Array.from({ length: 180 / 15 }).map((dot, index) => (
<div key={index} className={`circle ${compasDeg === 15 * index ? 'act' : ''}`} onClick={() => setCompasDeg(15 * index)}>
<div key={index} className={`circle ${getDegree(compasDeg) === 15 * index ? 'act' : ''}`} onClick={() => setCompasDeg(15 * index)}>
{index === 0 && <i>0°</i>}
{index === 6 && <i>90°</i>}
</div>
))}
<div className="compas">
<div className="compas-arr" style={{ transform: `rotate(${compasDeg}deg)` }}></div>
<div className="compas-arr" style={{ transform: `rotate(${getDegree(compasDeg)}deg)` }}></div>
</div>
</div>
</div>