Open mrklev opened 6 years ago
HI, I need to create a draggable and resizable rectangle. Currently I can drag the rectangle but I can't resize it. How can I do it , which method should I use?
code: html component: <ko-stage #stage [config]="configStage"> <ko-layer #layer> <ko-rect [config]="configRect"#rect >
ts component: import { Component, ViewChild, OnInit } from '@angular/core'; import { of, Observable } from 'rxjs'; import { KonvaComponent } from 'ng2-konva';
@Component({ selector: 'app-camera-img', templateUrl: './camera-img.component.html',
}) export class CameraImgComponent implements OnInit { @ViewChild('stage') stage: KonvaComponent; @ViewChild('layer') layer: KonvaComponent; @ViewChild('rect') rect: KonvaComponent;
public configStage: Observable = of({ width: 400, height: 200 });
public configRect: Observable = of({ x: 160, y: 60, width: 100, height: 90, fill: 'red', name: 'rect', stroke: 'black', draggable: true, });
constructor( private apiBackendService: ApiBackendService ) { } ngOnInit() { } }
HI, I need to create a draggable and resizable rectangle. Currently I can drag the rectangle but I can't resize it. How can I do it , which method should I use?
code: html component: <ko-stage #stage [config]="configStage"> <ko-layer #layer> <ko-rect [config]="configRect"#rect >
ts component: import { Component, ViewChild, OnInit } from '@angular/core'; import { of, Observable } from 'rxjs'; import { KonvaComponent } from 'ng2-konva';
@Component({ selector: 'app-camera-img', templateUrl: './camera-img.component.html',
}) export class CameraImgComponent implements OnInit { @ViewChild('stage') stage: KonvaComponent; @ViewChild('layer') layer: KonvaComponent; @ViewChild('rect') rect: KonvaComponent;
public configStage: Observable = of({
width: 400,
height: 200
});
public configRect: Observable = of({
x: 160,
y: 60,
width: 100,
height: 90,
fill: 'red',
name: 'rect',
stroke: 'black',
draggable: true,
});
constructor( private apiBackendService: ApiBackendService ) { } ngOnInit() { } }