qcast3/qcast-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

import 수정

Browse Source
This commit is contained in:
hyojun.choi 2024-07-31 10:58:06 +09:00
parent bf82b7fcae
commit 4dbebf4cf9
1 changed files with 50 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

69
src/components/Roof2.jsx
View File

@ -5,12 +5,11 @@ import { Button } from '@nextui-org/react'
import QRect from '@/components/fabric/QRect' import QRect from '@/components/fabric/QRect'
import RangeSlider from './ui/RangeSlider' import RangeSlider from './ui/RangeSlider'
import { useRecoilState } from 'recoil' import { useRecoilState, useRecoilValue } from 'recoil'
import { canvasSizeState, fontSizeState, sortedPolygonArray } from '@/store/canvasAtom' import { canvasSizeState, fontSizeState, roofState, sortedPolygonArray } from '@/store/canvasAtom'
import { QLine } from '@/components/fabric/QLine' import { QLine } from '@/components/fabric/QLine'
import { getCanvasState, insertCanvasState } from '@/lib/canvas' import { getCanvasState, insertCanvasState } from '@/lib/canvas'
import { calculateIntersection2 } from '@/util/canvas-util' import { calculateIntersection } from '@/util/canvas-util'
import { CustomLine } from '@/components/fabric/QLine'
import { QPolygon } from '@/components/fabric/QPolygon' import { QPolygon } from '@/components/fabric/QPolygon'
export default function Roof2() { export default function Roof2() {
@ -32,6 +31,8 @@ export default function Roof2() {
const [showControl, setShowControl] = useState(false) const [showControl, setShowControl] = useState(false)
const roof = useRecoilValue(roofState)
const { const {
mode, mode,
changeMode, changeMode,
@ -228,23 +229,53 @@ export default function Roof2() {
{ x: 1078, y: 92 }, { x: 1078, y: 92 },
] ]
if (canvas) { const twelvePoint = [
const polygon = new QPolygon(eightPoint, { { x: 195, y: 166 },
fill: 'transparent', { x: 195, y: 466 },
stroke: 'black', { x: 395, y: 466 },
strokeWidth: 1, { x: 395, y: 766 },
selectable: true, { x: 545, y: 766 },
fontSize: fontSize, { x: 545, y: 466 },
name: 'QPolygon1', { x: 695, y: 466 },
}) { x: 695, y: 666 },
{ x: 845, y: 666 },
{ x: 845, y: 466 },
{ x: 995, y: 466 },
{ x: 995, y: 166 },
]
canvas?.add(polygon) const complicatedType = [
{ x: 100, y: 100 },
{ x: 100, y: 1100 },
{ x: 400, y: 1100 },
{ x: 400, y: 800 },
{ x: 700, y: 800 },
{ x: 700, y: 1100 },
{ x: 1000, y: 1100 },
{ x: 1000, y: 600 },
{ x: 700, y: 600 },
{ x: 700, y: 300 },
{ x: 1000, y: 300 },
{ x: 1000, y: 100 },
]
handleOuterlinesTest2(polygon) const types = [type1, type2, type3, type4, type1A, type1B, eightPoint, eightPoint2, eightPoint3, eightPoint4, twelvePoint]
// const lines = togglePolygonLine(polygon) const polygon = new QPolygon(type1B, {
// togglePolygonLine(lines[0]) fill: 'transparent',
} stroke: 'black',
strokeWidth: 1,
selectable: true,
fontSize: fontSize,
name: 'QPolygon1',
})
canvas?.add(polygon)
handleOuterlinesTest2(polygon)
// const lines = togglePolygonLine(polygon)
// togglePolygonLine(lines[0])
} }
const rotateShape = () => { const rotateShape = () => {
@ -277,7 +308,7 @@ export default function Roof2() {
canvas?.add(line) canvas?.add(line)
canvas?.add(line2) canvas?.add(line2)
const interSectionPoint = calculateIntersection2(line, line2) const interSectionPoint = calculateIntersection(line, line2)
if (interSectionPoint) { if (interSectionPoint) {
const circle = new fabric.Circle({ const circle = new fabric.Circle({