Questions tagged [vue-konva]
37 questions
2
votes
1 answer
konva.js - fillPatternImage not being applied
I'm using konva.js via the vue-konva package. I'm trying to add a fillPatternImage but for some - probably simple reason - it's not being applied.
Here's the code:
// App.vue script
const loadImage = function (imgSrc) {
return new…

João Paulo Macedo
- 15,297
- 4
- 31
- 41
2
votes
1 answer
Draw shapes by konva to be displayed in canvas
I want to use konva in vue.js to draw shapes to be displayed in a canvas, so i have some rectangles stored in rectangles array which need to be drawn, but no thing is drawn.
2
votes
1 answer
which mobile app framework supports konva
I understand at the current moment, react-konva is not supported in React Native environment; however, wondering if vue-konva supports mobile app?
Or if you can suggest me a way to migrate konva canvas content to an android app?
Appreciate your…

Deepti Patro
- 21
- 1
2
votes
1 answer
How to create a video component with vue-konva?
With konva.js you can create video components on your canvas. Here you can see the example in the docs (https://konvajs.org/docs/sandbox/Video_On_Canvas.html).
Now I'm using vue-konva and there is no component to create a video on the canvas. You…

tomzinho
- 47
- 1
- 6
2
votes
1 answer
How can I call hide() on an object on the screen using vue-konva?
What is the object that is containing the v-xxx item (v-circle for example)? I want to simply call hide() on that object, and thought may be ref plays a key roll, but that was not successful (got this.$refs.testCircle.show is not a…

Shintaro Takechi
- 1,215
- 1
- 17
- 39
1
vote
1 answer
KonvaJS two finger pan and zoom on Mac
I'm using KonvaJS (more specifically vue-konva), and recently I've switched to a Macbook. I'm trying to implement two finger scrolling and panning. I already have the mousemove/mouseup/mousedown event and that works with one click panning.
I already…

Adam Silva
- 1,013
- 18
- 48
1
vote
1 answer
Konvajs/Vue-Konva connect the shapes using the connector dynamically
I am using Konvajs/Vue-Konva within my Vuejs/Nuxt application. Using Konva I am creating the Rect shape dynamically at run time. Now I would like to use some sort of Connectors to connect the different Rect Shapes so that I can have the logic of…

BATMAN_2008
- 2,788
- 3
- 31
- 98
1
vote
1 answer
Konvajs/Vue-konva add Text/Label to each of the created Rect shape
I am using Konvajs/Vue-Konva within my Vuejs/Nuxt application. Using Konva I am creating the Rect shape dynamically at run time. I would like to know if there is a way to add a Text/Label within each of the shapes. I want to add a name to each of…

BATMAN_2008
- 2,788
- 3
- 31
- 98
0
votes
0 answers
How to use Konva.js with the Android platform?
currently I'm developing a project using Konva.js and Vue-Konva.js. In the future, there's a new requirement for the project to run on the Android platform. To achieve this, I have a few ideas:
Develop an app version: Since Konva.js doesn't support…

Jessie Ho
- 13
- 3
0
votes
1 answer
Unknown VueKonva Type w/ TypeScript
I recently configured TypeScript for my Vue 2 project. Everything is working except for my VueKonva plugin - I receive the error below on app launch.
I tried adding "vue-konva", to types in tsconfig.json but no luck. Creating a vue-konva.d.js file…

Daniel Sposito
- 448
- 1
- 4
- 13
0
votes
1 answer
Resizing and clipping grouped element in Vue KonvaJS
I'm trying to build an application on KonvaJS with the Vue library.
I've got a group layer where I'm drawing a circle and placing images inside this group.

Nitish Kumar
- 6,054
- 21
- 82
- 148
0
votes
2 answers
Can I use an image (.svg) or svg path(?) in Konva.Group()'s clipFunc?
Suppose I have a map of the world.
And I'd like each continent to be an area where I could attach shapes to and drag/reshape them, while always being clipped by the continent's shape borders/limits.
Here's what I have so far:
const stage = new…

João Paulo Macedo
- 15,297
- 4
- 31
- 41
0
votes
0 answers
Distributed text alignment in Konva
I am using React Konva to draw shapes. I want the text can align distributed as Excel (not justify). How can I get that behavior ? I have included images about the detail of aligment. Thank you guys.
img1
img2

Tam Duc
- 1
- 1
0
votes
0 answers
Uncaught TypeError: Cannot read properties of undefined (reading 'component') Vue 2 Konva
The Vue Konva setup runs properly on local dev envs
After building the app as it fails to find v-stage tag and Konva component also
Versions being used
"vue": "^2.6.14",
"vue-konva": "^2.1.7",
"konva": "^8.3.10",
Error message
import VueKonva from…

Rohan Shah
- 1
- 1
0
votes
1 answer
Konva JS why scenefunc context.circle is not working?
I am trying to create custom share a circle and BIN inside that circle to use as button.
but context.circle is not working in documention they mentioned, rect, circle, text.. we can use with custom shape.
Please letme know what is the issue, is it…

Saba Naeem
- 35
- 5