Konva - finding the center of the current view
Your app allows zooming and panning and now you need to find the center of the current canvas view to add a new shape. How do you do that...
A tech blog giving usable explainers, advice, tools, tricks and techniques for the Konva JavaScript canvas library, the HTML5 canvas, and related subjects.
Your app allows zooming and panning and now you need to find the center of the current canvas view to add a new shape. How do you do that...
Your UI needs some way to let the user defocus from some selected element, maybe hiding the transformer or closing a popup. How to do that easily?
I was fiddling with a simple toolbar when I changed the scale to 2x. Suddenly my toolbar is huge - not what I needed. So how to keep one shape at 1:1 scale while all around it change their size? Read on...
In canvas apps we need to make buttons and use icons for other purposes. Font Awesome and its fellows are often selected by the boss as a critical requirement. They're easy to use with HTML elements and CSS, but what about the HTML5 canvas? Here's a way...
Someone asked on the Discord channel about how to make a border around a multi-line Konva.Text element and how to get that border to tightly wrap around the text. They had tried making a Konv.Rect at the same size and position as the text shape but the border had too much gap. Lets take a look...
If you are laying out text then you will need to justify it. But what's the algorithm? Lets take a look...
I found a frustration in the act of making arrays of acceptable values to use in input validation for closed lists when I'd already defined the same when setting the types. Could I find a way to set up the array once and use for both needs?
Ever needed to put a direction of flow indicator on some connector line? In this post I explain a simple approach to get that done.