Questions tagged [konva]

Konva is an HTML5 Canvas JavaScript framework that extends the 2d context by enabling canvas interactivity for desktop and mobile applications.

Konva is an HTML5 Canvas JavaScript framework that extends the 2d context by enabling canvas interactivity for desktop and mobile applications.

270 questions
0
votes
0 answers

Is there any way to refresh the ng2-konva layer?

I have created an angular component which is responsible to draw the images on the web screen, I created two konva layers, baseLayer and assetLayer. BaseLayer will draw base image on screen and than assetLayer will draw another setup of images on…
SMJ
  • 1
  • 2
0
votes
0 answers

Adding drag and drop connectors in react-konva

I'm using react-konva and I'm trying to add connector lines between circles by dragging from one circle and then dropping it on the other circle to be connected. So far I have tried it by clicking the circles to create a line between them and made…
mplusr
  • 151
  • 15
0
votes
2 answers

React Konva - undo free draw lines

I was following this tutorial on how to build a whiteboard with react and konva and it provides an undo function for shapes but does not work for lines because lines are not added to the layer in the same way. How can I implement undo for free draw…
cbutler
  • 833
  • 13
  • 36
0
votes
1 answer

How to get width of the image with non zero rotation (konva)

I have an image inside Group element. With Transformer element, user changes image width and rotation. After that, how do I get image width? getWidth() returns the value which I manually have set while creating new Image. getClientRect().width…
salkcid
  • 89
  • 6
0
votes
1 answer

ReactJS and Konva free drawing with pencil, brush and eraser

I want to create a simple app where I can choose between pencil, brush and eraser. I have Home.js and addLine.js. But there is a bug which I cant fix. When I change from brush back to pencil I'am drawing with the pencil but there is something like a…
retro
  • 51
  • 8
0
votes
1 answer

Don't effect element position while scaling stage in konva.js

I am creating page creation software online using amazing konva.js so the problem is when I was scaling the stage the whole elements are changing there position. Before scaling whole stage After scaling the stage the line text is not in…
Ahmed Ali
  • 1,908
  • 14
  • 28
0
votes
1 answer

Apply Caman JS preset filters to Konva React

By creating a ref for the layer component I am able to access the canvas element which I could then pass to the caman function to apply a preset filter to the image in the canvas. This works as expected however, when saving the stage as an image the…
Kevin Mangal
  • 230
  • 1
  • 3
  • 14
0
votes
2 answers

Adding transformer to dynamically generated shapes?

I have the button which add new group which have square, to layer when clicked very simple code I guess no need to post. But my question is that how can I add transformer to it when on clicked?, I have done it with this mouseleave and mouseenter…
Ahmed Ali
  • 1,908
  • 14
  • 28
0
votes
0 answers

Add transformer to node when clicked - KonvaJs

I am creating an application and having some issue in adding transformer to node when clicked, I have done creating a .on function and getting node instance by evt.target but don't know how to attach transformer to node, There is a twist I have…
Ahmed Ali
  • 1,908
  • 14
  • 28
0
votes
1 answer

react-konva - running sprite animation and filter at the same time

To summarize, I can't animate Konva sprites and apply Konva filters at the same time. I'm drawing a complex stage using react-konva, and parts of it contains animated images using Sprite component animations. In order to start the animations, I am…
gunshinx
  • 3
  • 2
0
votes
1 answer

How to save stage of canvas in JSON format?

In my current project I want to build something like Image Editor with react and react-konva. First of all, I render a konva stage with some props and default draggable stars. In the next step we can set background image for our stage using Image…
Elli Zorro
  • 463
  • 3
  • 19
0
votes
1 answer

Importing IReact type definition

I have a variable that holds a Group Reference and when I call getClientRect() it returns the "IReact" type. Since IReact is not in the default types index should I import the type from the internal types file or is there a better…
0
votes
1 answer

KonvaJS - Text bounding box around KonvaText without top,bottom space

What would be the best way to create a bounding box around KonvaText, without any padding or space in between the top and bottom? The blue colour box is the current bounding box, and the requirement is to remove the top and bottom space like in the…
Malith B
  • 37
  • 5
0
votes
1 answer

Konvajs drawing first point when move drawing line around

I have the following problem: I'm using konvajs to build a canvas where you can draw for example lines in it. Plus you should be able to move these lines around. Untill here no problems, giving the lines the draggable attributes everything works…
Sega
  • 47
  • 6
0
votes
2 answers

Konva stops working on iPhone after three pages?

First time poster and extremely amateur website maker here. I made this test site with Konva: https://snuck.in/test/pink You can tap the square to go to the next page. It works fine on an old iPhone 5 (iOS 10.3.4). I'm able to tap through endless…
elis
  • 3
  • 2
1 2 3
17
18