diff --git a/src/components/Canvas/DepthCanvas/manager/CanvasManager.ts b/src/components/Canvas/DepthCanvas/manager/CanvasManager.ts index a059f55..b34edcc 100644 --- a/src/components/Canvas/DepthCanvas/manager/CanvasManager.ts +++ b/src/components/Canvas/DepthCanvas/manager/CanvasManager.ts @@ -33,21 +33,21 @@ export class CanvasManager { setCanvasViewSize(options) { this.canvasViewWidth = options.canvasViewWidth || 1920 this.canvasViewHeight = options.canvasViewHeight || 1080 + this.canvas.setWidth(this.canvasViewWidth) + this.canvas.setHeight(this.canvasViewHeight) } initCanvas(options: CanvasInitOptions) { this.layerManager = this.stateManager.layerManager - this.setCanvasViewSize(options) this.canvasWidth = options.canvasWidth || 750 this.canvasHeight = options.canvasHeight || 600 this.canvas = createCanvas(options.canvasRef.value, { - width: this.canvasViewWidth, - height: this.canvasViewHeight, preserveObjectStacking: true, enableRetinaScaling: true, stopContextMenu: true, fireRightClick: true, backgroundColor: '#fff', }) + this.setCanvasViewSize(options) this.canvas.clipPath = new fabric.Rect({ left: 0, top: 0, diff --git a/src/components/Canvas/DepthCanvas/manager/RectToolManager.ts b/src/components/Canvas/DepthCanvas/manager/RectToolManager.ts index 6e744c9..d7baeed 100644 --- a/src/components/Canvas/DepthCanvas/manager/RectToolManager.ts +++ b/src/components/Canvas/DepthCanvas/manager/RectToolManager.ts @@ -47,6 +47,14 @@ export class RectToolManager { if(height === 0) height = 50 this.demoObject.set({ width, height }) const object = this.demoObject.toJSON("evented") + if(object.width < 0) { + object.left += object.width + object.width = -object.width + } + if(object.height < 0) { + object.top += object.height + object.height = -object.height + } this.layerManager.createRectLayer(object, true) this.canvasManager.canvas.remove(this.demoObject) this.canvasManager.canvas.renderAll()