방위 범위입력 추가
This commit is contained in:
parent
a250507ab9
commit
a41fe47387
@ -6,6 +6,19 @@ export default function Orientation({ setTabNum }) {
|
|||||||
const [compasDeg, setCompasDeg] = useState(0)
|
const [compasDeg, setCompasDeg] = useState(0)
|
||||||
const [hasAnglePassivity, setHasAnglePassivity] = useState(false)
|
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 (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="properties-setting-wrap">
|
<div className="properties-setting-wrap">
|
||||||
@ -18,7 +31,7 @@ export default function Orientation({ setTabNum }) {
|
|||||||
{Array.from({ length: 180 / 15 }).map((dot, index) => (
|
{Array.from({ length: 180 / 15 }).map((dot, index) => (
|
||||||
<div
|
<div
|
||||||
key={index}
|
key={index}
|
||||||
className={`circle ${compasDeg === 15 * (12 + index) ? 'act' : ''}`}
|
className={`circle ${getDegree(compasDeg) === 15 * (12 + index) ? 'act' : ''}`}
|
||||||
onClick={() => setCompasDeg(15 * (12 + index))}
|
onClick={() => setCompasDeg(15 * (12 + index))}
|
||||||
>
|
>
|
||||||
{index === 0 && <i>180°</i>}
|
{index === 0 && <i>180°</i>}
|
||||||
@ -26,13 +39,13 @@ export default function Orientation({ setTabNum }) {
|
|||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
{Array.from({ length: 180 / 15 }).map((dot, index) => (
|
{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 === 0 && <i>0°</i>}
|
||||||
{index === 6 && <i>90°</i>}
|
{index === 6 && <i>90°</i>}
|
||||||
</div>
|
</div>
|
||||||
))}
|
))}
|
||||||
<div className="compas">
|
<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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user