1

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,

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()