konvajs - quan1997ap/angular-app-note GitHub Wiki

Vẽ shape

1. Poligon editor

https://codepen.io/akitanak/pen/wEMQvL
https://konvajs.org/docs/sandbox/Image_Border_Highlighting.html \

var polygon = new Konva.Line({
  points: circlesToPoints(circles),
  fill: '#ff000088',
  stroke: '#ff0000',
  strokeWidth: 1,
  draggable: false,
  closed: false,
  dash:[]
});

closed: false: Line-Spline
closed: true: polygon

2. How to modify line points with anchors

2.1. Spline konvajs editor

Kết hợp
https://konvajs.org/docs/shapes/Line_-_Spline.html
https://konvajs.org/docs/sandbox/Modify_Curves_with_Anchor_Points.html

2.2. Line konvajs editor

https://jsbin.com/wahetunepa/edit?html,js,output

3. Object selector

• Select One https://konvajs.org/docs/selectors/Select_by_id.html

• Select Many https://stackoverflow.com/questions/47395110/selecting-by-drawing-a-box-around-objects-in-konva

4. Event

https://konvajs.org/docs/events/Binding_Events.html

5. Zoom and Drag with Konva.js

https://codepen.io/atindo23/pen/byZEpY

6. Responsive_Canvas

https://konvajs.org/docs/sandbox/Responsive_Canvas.html

7. Gird display

https://eecs.blog/javascript-2d-library-konva-js/?expand_article=1

8. Drag_and_drop Bounds ( kéo thả trong vùng xác định )

https://konvajs.org/docs/drag_and_drop/Complex_Drag_and_Drop.html

9. Draw with the left mouse button and drag the stage with the right mouse button?

https://stackoverflow.com/questions/54073037/is-it-possible-in-konva-js-to-draw-with-the-left-mouse-button-and-drag-the-stage

10. Drag objects outside of main canvas

https://codepen.io/hokiedsp/pen/mddWNOX