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
1 answer

Canvas not drawing images - Electron + Vue

I'm trying to draw images in my canvas, but for some reason it's not working. I've tried with default canvas API, KonvaJS and FabricJS, but none of these worked. Other shapes like rects, circles etc works normaly... My project is an electron app…
Gabriel Borges
  • 63
  • 1
  • 1
  • 9
0
votes
0 answers

KonvaJS | Incorrect Shape Position

I have a problem which is about how to position the shape according to x and y coordinates. I have tried the following: var shapes = JSON.parse('<%=jsonArray%>'); for (var i = 0; i < shapes.length; i ++ ){ var shape =…
0
votes
1 answer

Vue-Konva: Is there a way to reorder layers on the fly?

So, I've been working with vue-konva and I have something like this:
GAW
  • 85
  • 1
  • 5
0
votes
1 answer

KonvaJS - How to add shape with button trigger?

Sorry for bad grammar- i have a problem about how to add shape with button trigger. but isn't working here my code : HTML And here my js : function…
0
votes
2 answers

How to get ending position of line in React-Konva

Sorry, I'm new to coding and am struggling on something I believe is quite basic. I want to draw a shape via multiple konva line objects. Once I've created a line, instead of manually calculating where the next line should begin, I'm thinking there…
0
votes
0 answers

Using custom model objects as provider for v-for in Vue?

new to Vue - learning as I go about exploring. I'm trying to use a custom object as data source for a v-for situation. So far, not working - I admit I'm not sure how to access data by name in a Vue component. main.js import Vue from "vue"; import…
Saeven
  • 2,280
  • 1
  • 20
  • 33
0
votes
1 answer

How can I achieve zoom on scroll in Angular wint Konva

I tried for several days to find a way to zoom in Konva for my Angular app. In my html page, I have multiple ko-image tags in my app with different [config]. I want to put an wheel event on the ko-stage that will let me zoom in or zoom out. This is…
ZoicanDenis
  • 21
  • 1
  • 7
0
votes
1 answer

How to attach the Konvajs Transformer to multiple shapes without groupping them?

I'm working on a Konvajs based designer tool project where u'll be able to select multiple shapes with MouseClick+CntrlKey. The idea is that once the first shape is selected, the Transformer is created an attached to it. If u're holding CntrlKey and…
0
votes
1 answer

Cannot read property 'apply' of undefined Konva.js

I'm trying to find object by using method find. It is only a part of code, just to demonstrate issue. In general I need to find object from array of Shapes from Konva framework. I got it by using refs after rendering functional component. import…
Maksim
  • 3
  • 2
-1
votes
1 answer

How to pixel perfect align text-element

I want my vue Konva Text element to completely fill the given height, like i expect of a rectangle. This is issue becomes obvious when pairing with text images, (converting svg text to canvas) that properly match the given dimension
-1
votes
1 answer

Scaling IMAGE around pointer in Konva

Can't wrap my head around this and get it to work. Trying to transpose this sample on Konva, but can not get it to work with an image inside a layer, inside the stage. The sample I am trying to reproduce is the "Zooming stage relative to pointer…
Olle
  • 47
  • 1
  • 4
-1
votes
1 answer

onDragEnd not fired when viewport is left

I have found the layer remains in dragmove state when a it is dragged out of the viewport and the mouse button is released. Did you experience this kind of issue? Have a look over here: https://codesandbox.io/s/llxq3yv829?file=/index.js Drag the red…
spancioc
  • 23
  • 2
-2
votes
1 answer

konva, container with vuejs

I got the problem, that VueJS refuse me a problem when I use the . I have to use that element, because otherwise elements are not overlapping themselfes. Pics: ide console
WilczekCK
  • 1
  • 1
-2
votes
1 answer

Create road section using javascript

In my React application I want to create not the usual form for creating road section. For example, I have this scheme in png format. But I want to create an interactive editor in which it will be possible to create schemes, save them to the server…
Elli Zorro
  • 463
  • 3
  • 19
-3
votes
1 answer

How to fix the Animation effect for forloop

how to make animation for whole for loop in js? for (var n = 0; n < lessons.length; n++) { var j = n % 2 + 2; layer.add(new Konva.Circle({ name:""+lessons[n].id, x: x + (n * 90), …
Peter
  • 1
1 2 3
17
18