All notable changes to this project will be documented in this file. This project adheres to Semantic Versioning.
- Fix freeze on ios on touch cancel event
- Typescript fixes
- fix letter spacing for Hindi text
- ts fixes
- Fix shadow + corner radius for images
- Support
fillRule
forKonva.Shape
on hit graph
- Fallback for
Konva.Text.measureSize()
when 2d context doesn't return full data
- Fix stopped transforming when it was triggered by multi-touch
- Fix svg
path.getPointAtLength()
calculations in some cases - Fix
shape.getClientRect()
when any of parents is cached
- Fix chrome clear canvas issue
- Typescript fixes
- Fix underline and line-through for
Konva.Text
whenKonva._fixTextRendering = true
- Fix click events fires on stage
- Temporary
Konva._fixTextRendering = true
flag to fix inconsistent text
- Fix transformer bug to enable hit graph back
tranformer
event will be triggered AFTER all data of transformer is updated- Improve performance of transformer
- Fix clipping with zero size
- Another fix for exporting buffered shapes
- Fix large memory usage on node export
- Fix Pixelate filter work/fix caching size
- Fix node export when large buffer canvas is used
- New attribute
rotateLineVisible
forKonva.Transformer
to show/hide rotate line
- Better
Konva.Transformer
work when it hasflipEnabled = false
.
- Better RTL support
- Some typescript fixes
- Fix text rendering when text has both underline and shadow
- Typescript fixes
- More controls on clipping
fillRule
forKonva.Shape
- New
anchorStyleFunc
forKonva.Transformer
to customize anchor style
- Better text rendering when it has stroke
- Better performance for any instance creation
- Little typescript fixes
- Migrate the npm package from ES back to CommonJS
- Some fixes for
Konva.TextPath
calculations and rendering. - Resolve "willReadFrequently" warning in Chrome
- Typescript fixes
- Better validation for
Konva.Transfomer
nodes
property
- Fix justify on text with limited height
- Typescript fixes for
container.add()
method. Ability to use empty array as argument. E.g.container.add(...emptyArray)
- Fix underline for justify text
- Fix gradient display on underline or line-through text
- Add support for
cornerRadius
for Konva.Image - Fix cloning of
Konva.Transformer
- Automatically release (destroy) used canvas elements. Should fix safari memory issues
- Typescript fixes
- Better non-passive events usage
- Better 2d context usage to avoid Chrome warnings
ellipsis
fixes forKonva.Text
- Allow reset component attributes via overloader
- Fix
Konva.Label
position when tag attributes are changed - Fix incorrect ellipsis display for
Konva.Text
- Fix
click
event trigger on parent containers on touch devices - Fix incorrect
mouseleave
event trigger when drag is finished
- Skip
Konva.Transformer
incontainer.getClientRect()
calculations
- Typescript fixes
- Disable all exports in
package.json
- Migrate to CommonJS exports only
- Better exports definitions. Importing
Konva
should work better in different bundlers and test environments. imageSmoothingEnabled
option fornode.toDataURL()
,node.toCanvas()
andnode.toImage()
- Quick fix for
toCanvas()
andtoDataURL()
size calculation.
- Fix characters positions calculations on
fontFamily
changes inTextPath
. - Remove rounding in
node.getClientRect()
results - Fix event object on
transformstart
event.
- Fix
justify
align for text with several paragraphs.
- Remove source maps for webpack builds
- Fix
dbltap
event in Safari - A bit faster
node.moveToTop()
when node is already on top - Better client rect calculations for
Konva.Arc
shape.
- new
transformer.anchorDragBoundFunc
method.
- Fix not working
Konva.Transformer
when several transformers were used
- Fix
Konva.Arrow
rendering when it has two pointers
- Fix
package.json
exports.
- Restore build in CommonJS.
const Konva = require('konva/cmj').default;
- Fix arrow rendering when dash is used
- Fix
dbltap
trigger when multi-touch is used
- Fix
dblclick
event whencancelBubble
is used.
- Fix
fillPattern
cache invalidation on shapes
- Fix memory leak for
Konva.Image
- Fix
Konva.Transformer
dragging draw whenshouldOverdrawWholeArea = true
. - Fix auto redraw when
container.removeChildren()
orcontainer.destroyChildren()
are used
- New property
useSingleNodeRotation
forKonva.Transformer
.
- Fix fill pattern updates on
fillPatternX
andfillPatternY
changes.
- Fix some transform caches
- Fix cache with hidden shapes
- Some typescript fixes
This is a very large release! The long term of Konva
API is to make it simpler and faster. So when possible I am trying to optimize the code and remove unpopular/confusing API methods.
BREAKING:
Konva.Collection
is removed.container.children
is a simple array now.container.find()
will returns an array instead ofKonva.Collection()
instance.Konva.Collection
was confusing for many users. Also it was slow and worked with a bit of magic. So I decided to get rif of it. Now we are going to use good old arrays.
// old code:
group.find('Shape').visible(false);
// new code:
group.find('Shape').forEach((shape) => shape.visible(false));
- argument
selector
is removed fromnode.getIntersection(pos)
API. I don't think you even knew about it. Konva.Util.extend
is removed.- All "content" events from
Konva.Stage
are removed. E.g. instead ofcontentMousemove
just usemousemove
event.
New features:
- All updates on canvas will do automatic redraw with
layer.batchDraw()
. This features is configurable withKonva.autoDrawEnabled
property. Konva will automatically redraw layer when you change any property, remove or add nodes, do caching. So you don't need to calllayer.draw()
orlayer.batchDraw()
in most of the cases. - New method
layer.getNativeCanvasElement()
- new
flipEnabled
property forKonva.Transformer
- new
node.isClientRectOnScreen()
method - Added
Konva.Util.degToRad
andKonva.Util.radToDeg
- Added
node.getRelativePointerPosition()
Changes and fixes:
- Full migration to ES modules package (!), commonjs code is removed.
konva-node
is merged intokonva
npm package. One package works for both environments.- Full event system rewrite. Much better
pointer
events support. - Fix
TextPath
recalculations onfontSize
change - Better typescript support. Now every module has its own
*.d.ts
file. - Removed
Konva.UA
,Konva._parseUA
(it was used for old browser detection) - Fixed Arrow head position when an arrow has tension
textPath.getKerning()
is removed- Fix
a
command parsing forKonva.Path
- Fix fill pattern for
Konva.Text
when the pattern has an offset or rotation Konva.names
andKonva.ids
are removedKonva.captureTouchEventsEnabled
is renamed toKonva.capturePointerEventsEnabled
- Fix transform update on
letterSpacing
change ofKonva.Text
- Fix wrong
mouseleave
trigger forKonva.Stage
- Fix transformer rotation when parent of a node is rotated too.
- Fix wrong size calculations for
Konva.Line
with tension - Fix
shape.intersects()
behavior when a node is dragged - Fix ellipsis rendering for
Konva.Text
- Fix correct rendering of
Konva.Label
when heigh of text is changed - Fix correct
transformstart
andtransformend
events when several nodes are attached withKonva.Transformer
- New property
fillAfterStrokeEnabled
forKonva.Shape
. See API docs for more information. - Fix for
Konva.Transformer
when it may fail to draw. - Fix rendering of
TextPath
one more time.
- Fix autodrawing for
Konva.Transformer
when it is on a different layer - Fix
Konva.RegularPolygon
size calculations.
- Fix incorrect rendering of
TextPath
in some cases. (again)
- Fix incorrect rendering of
TextPath
in some cases.
- Fix for correct image/dataURL/canvas exports for
Konva.Stage
.
- Performance fixes for dragging many nodes with
Konva.Transformer
. - Documentation updates
- Perf fixes
- Change events trigger flow, so adding new events INSIDE event callback will work correctly.
- Fix double
dragend
,dragstart
,dragmove
triggers onKonva.Transformer
- Text rendering fixes
- fix ellipses behavior for
Konva.Text
. - fix scaled fill pattern for text.
- fixes for
dragstart
event whenKonva.Transformer
is used.dragstart
event will have correct nativeevt
reference - Better unicode support in
Konva.Text
andKonva.TextPath
. Emoji should work better now 👍
- Multi row support for
ellipsis
config forKonva.Text
- Better
Konva.Transfomer
behavior when single attached node is programmatically rotated.
- fixes for
dragstart
event whenKonva.Transformer
is used.dragstart
will not bubble from transformer. string
andfill
properties validation can acceptCanvasGradient
as valid value
- Better performance for stage dragging
- Fixes for
node.cache()
function.
- Add
onUpdate
callbacks toKonva.Tween
configuration andnode.to()
method. - Up to 6x faster initializations of objects, like
const shape = new Konva.Shape()
.
- Fix wring
dragend
trigger ondraggable
property change insideclick
- Fix incorrect text rendering with
letterSpacing !== 0
- Typescript fixes
- Fix wrong trigger
dbltap
andclick
on mobile
- Fixes for different font families support.
- Fixes for
Konva.Transformer
positions - Types fixes for better Typescript support
- BREAKING
inherit
option is removed fromvisible
andlistening
. They now just have boolean valuestrue
orfalse
. If you dogroup.listening(false);
then whole group and all its children will be removed from the hitGraph (and they will not listen to events). Probably 99%Konva
applications will be not affected by this breaking change. - Many performance fixes and code size optimizations. Up to 70% performance boost for many moving nodes.
layer.hitGraphEnabled()
is deprecated. Just uselayer.listening(false)
instead- Better support for font families with spaces inside (like
Font Awesome 5
). - Fix wrong
dblclick
anddbltap
triggers - Deprecate
Konva.FastLayer
. Usenew Konva.Layer({ listening: false });
instead. dragmove
event will be fired onKonva.Transformer
too when you drag a node.dragmove
triggers only after ALL positions of dragging nodes are changed
- BREAKING!
boundBoxFunc
ofKonva.Transformer
works in absolute coordinates of whole transformer. Previously in was working in local coordinates of transforming node. - Many
Konva.Transformer
fixes. Now it works correctly when you transform several rotated shapes. - Fix for wrong
mouseleave
andmouseout
fire on shape remove/destroy.
- Fixes for
boundBoxFunc
ofKonva.Transformer
.
- Deatach fixes for
Konva.Transformer
- Fixes for
Konva.Transformer
when parent scale is changed - Fixes for
Konva.Transformer
when parent is draggable - Performance optimizations
- New
Konva.Transformer
implementation!. Old API should work. But I marked this release ismajor
(breaking) just for smooth updates. Changes:- Support of transforming multiple nodes at once:
tr.nodes([shape1, shape2])
. tr.node()
,tr.setNode()
,tr.attachTo()
methods are deprecated. Usetr.nodes(array)
instead- Fixes for center scaling
- Fixes for better
padding
support Transformer
can be placed anywhere in the tree of a stage tree (NOT just inside a parent of attached node).
- Support of transforming multiple nodes at once:
- Fix
imageSmoothEnabled
resets when stage is resized - Memory usage optimizations when a node is cached
- Fix hit stroke issues
- Fix some issues with
mouseenter
andmouseleave
events. - Deprecate
hitStrokeEnabled
property - Fix rounding issues for
getClientRect()
for some shapes
- Add
rotationSnapTolerance
property toKonva.Transformer
. - Add
getActiveAnchor()
method toKonva.Transformer
- Fix hit for non-closed
Konva.Path
- Some fixes for experimental Offscreen canvas support inside a worker
- Events fixes for
Konva.Transformer
- Now
Konva
will keepid
in a cloned node - Better error messages on tainted canvas issues
- Fixes for
path.getClientRect()
function calculations
- Fix wrong internal caching of absolute attributes
- Fix
Konva.Transformer
behavior on scaled with CSS stage
- Fix line with tension calculations
- Add
node.getAbsoluteRotation()
method - Fix cursor on anchors for rotated parent
- Fix possible
NaN
in content calculations
- Add ability to use
width = 0
andheight = 0
forKonva.Image
. - Fix
cache()
method ofKonva.Arrow()
- Add
Transform
toKonva
default exports. SoKonva.Transform
is available now.
- Make events work on some CSS transforms
- Fix caching on float dimensions
- Fix
mouseleave
event on stage. - Increase default anchor size for
Konva.Transformer
on touch devices
- Fix
path.getClientRect()
calculations forKonva.Path
- Fix wrong fire of
click
andtap
events on stopped drag events.
- Allow hitStrokeWidth usage, even if a shape has not stroke visible
- Better IE11 support
- Warn on undefined return value of
dragBoundFunc
. - Better calculations for
container.getClientRect()
- TS fixes
- Better calculations for
TextPath
with align = right - Better
textPath.getClientRect()
- TS fixes
- Fix globalCompositeOperation + cached hit detections.
- Fix absolute position calculations for cached parent
- Fix
line.getClientRect()
calculations for line with a tension or low number of points
- Fix some bugs when
Konva.Transformer
haspadding > 0
- Fix drag position handling
- Fix multiple selector for find() method
- Fix
Konva.Transformer
behavior on mirrored nodes - Fix
stage.getPointerPosition()
logic.
- Fix
dragend
event on click - Revert fillPatternScale for text fix.
- Fixed evt object on
dragstart
- Fixed double tap trigger after dragging
- Fix fillPatternScale for text
- Fix
dragstart
flow whennode.startDrag()
is called. - Fix
tap
anddbltap
double trigger on stage
- Add
node.isCached()
method - Fix nested dragging bug
- Slightly changed
mousemove
event flow. It triggers for firstmouseover
event too - Better
Konva.hitOnDragEnabled
support for mouse inputs
- Fixed
node.startDrag()
behavior. We can call it at any time.
- Better
Konva.Arrow
+ tension drawing - Typescript fixes
Basically the release doesn't have any breaking changes. You may only have issues if you are using something from Konva.DD
object (which is private and never documented). Otherwise you should be fine. Konva
has major upgrade about touch events system and drag&drop flow. The API is exactly the same. But the internal refactoring is huge so I decided to make a major version. Please upgrade carefully. Report about any issues you have.
- Better multi-touch support. Now we can trigger several
touch
events on one or many nodes. - New drag&drop implementation. You can drag several shapes at once with several pointers.
- HSL colors support
- Fix wrong double tap trigger
- TS types fixes
- Added support for different values for
cornerRadius
ofKonva.Rect
- Some fixes for better support
konva-node
- TS types fixes
- TS types fixes
- Add new property
imageSmoothingEnabled
to the node caching - Even more ts fixes. Typescript need a lot of attention, you know...
- Enable strict mode for ts types
- Add new property
imageSmoothingEnabled
to the layer
- Typescript fixes
- Experimental pointer events support. Do
Konva._pointerEventsEnabled = true;
to enable - Fix some
Konva.Transformer
bugs.
- Typescript fixes again
- Show a warning when
Konva.Transformer
and attaching node have different parents. - Typescript fixes
- Fix some stage events.
mouseenter
andmouseleave
should work correctly on empty spaces - Fix some typescript types
- Better detection of production mode (no extra warnings)
- Fix
hasName
method for empty name cases
- Remove
dependencies
from npm package
- Better
find
andfindOne
lookup. Now we should not care about duplicate ids. - Better typescript definitions
- new property
shape.hitStrokeWidth(10)
- Better typescript definitions
- Remove
Object.assign
usage (for IE11 support)
- Better modules and TS types
- Fix commonjs exports
- Fix global injections
- Make
Konva
modular:import Konva from 'konva/lib/Core';
; - Fix incorrect
Transformer
behavior - Fix drag&drop for touch devices
Customs builds are temporary removed from npm package. You can not use import Konva from 'konva/src/Core';
.
This feature will be added back later.
That changes are private and internal specific. They should not break most of Konva
apps.
Konva.Util.addMethods
is removedKonva.Util._removeLastLetter
is removedKonva.Util._getImage
is removedKonv.Util._getRGBAString
is removedKonv.Util._merge
is removed- Removed polyfill for
requestAnimationFrame
. id
andname
properties defaults are empty strings, notundefined
- internal
_cache
property was updated to use es2015Map
instead of{}
. Konva.Validators
is removed.
- Show a warning when a stage has too many layers
- Show a warning on duplicate ids
- Show a warning on weird class in
Node.create
parsing from JSON - Show a warning for incorrect value for component setters.
- Show a warning for incorrect value for
zIndex
property. - Show a warning when user is trying to reuse destroyed shape.
- new publish method
measureSize(string)
forKonva.Text
- You can configure what mouse buttons can be used for drag&drop. To enable right button you can use
Konva.dragButtons = [0, 1]
. - Now you can hide stage
stage.visible(false)
. It will set its container display style to "none". - New method
stage.setPointersPositions(event)
. Usually you don't need to use it manually. - New method
layer.toggleHitCanvas()
to show and debug hit areas
- Full rewrite to Typescript with tons of refactoring and small optimizations. The public API should be 100% the same
- Fixed
patternImage
andradialGradient
forKonva.Text
Konva.Util._isObject
is renamed toKonva.Util._isPlainObject
.- A bit changed behavior of
removeId
(private method), now it doesn't clear node ref, if object is changed. - simplified
batchDraw
method (it doesn't useKonva.Animation
) now. - Performance improvements for shapes will image patterns, linear and radial fills
text.getTextHeight()
is deprecated. Usetext.height()
ortext.fontSize()
instead.- Private method
stage._setPointerPosition()
is deprecated. Usestage.setPointersPositions(event)
;
- Better mouse support on mobile devices (yes, that is possible to connect mouse to mobile)
- Better implementation of
mouseover
event for stage - Fixed underline drawing for text with
lineHeight !== 1
- Fixed some caching behavior when a node has
globalCompositeOperation
. - Fixed automatic updates for
Konva.Transformer
- Fixed container change for a stage.
- Fixed warning for
width
andheight
attributes forKonva.Text
- Fixed gradient drawing for
Konva.Text
- Fixed rendering with
strokeWidth = 0
- Performance fixes when cached node has many children
- Better drawing for shape with
strokeScaleEnabled = false
on HDPI devices
- New
ignoreStroke
forKonva.Transformer
. Good to use when a shape hasstrokeScaleEnabled = false
getKerning
TextPath API is deprecated. UsekerningFunc
instead.
- Use custom functions for
trimRight
andtrimLeft
(for better browsers support)
- New
anchorCornerRadius
forKonva.Transformer
- Performance fixes for caching
dragstart
event behavior is a bit changed. It will fire BEFORE actual position of a node is changed.
- Fixed a wrong cache when a shape inside group has
listening = false
- Added some text trim logic to wrap in better
getClientRect
for complex paths fixesgetClientRect
calculation fix for groups- Update
Konva.Transformer
onrotateEnabled
change - Fix click stage event on dragend
- Fix some Transformer cursor behavior
- Centered resize with ALT key for
Konva.Transformer
- New
centeredScaling
forKonva.Transformer
- Tween support for gradient properties
- Add
user-select: none
to the stage container to fix some "selected contend around" issues
- new methods
path.getLength()
andpath.getPointAtLength(val)
verticalAlign
forKonva.Text
- Default duration for tweens and
node.to()
methods is now 300ms - Typescript fixes
- Automatic validations for many attributes
- New properties for
Konva.Transformer
:borderStroke
,borderStrokeWidth
,borderDash
,anchorStroke
,anchorStrokeWidth
,anchorSize
.
- Some properties of
Konva.Transformer
are renamed.lineEnabled
->borderEnabled
.rotateHandlerOffset
->rotateAnchorOffset
,enabledHandlers
->enabledAnchors
.
- Some
Konva.Transformer
fixes - Typescript fixes
stage.toDataURL()
fixes when it has hidden layersshape.toDataURL()
automatically adjust position and size of resulted image
toObject
fixes
- Some drag&drop fixes
- Removed wrong dep
- Typescript fixes
- Typescript fixes
- add shape as second argument for
sceneFunc
andhitFunc
- Fixed
Konva.Text
justify drawing for a text with decoration - Added methods
data()
,setData()
andgetData()
methods toKonva.TextPath
- Correct cache reset for
Konva.Transformer
Konva.Transformer
automatically track shape changesKonva.Transformer
works with shapes with offset too
- Cursor fixes for
Konva.Transformer
- Fixed lineHeight behavior for
Konva.Text
- Some performance optimizations for
Konva.Text
- Better wrap algorithm for
Konva.Text
- fixed
Konva.Arrow
with tension != 0 - Some fixes for
Konva.Transformer
- Typescript defs for
Konva.Transformer
- Typescript defs for
globalCompositeOperation
- Fixed flow for
contextmenu
event. Now it will be triggered on shapes too find()
method for Containers can use a function as a parameter
- some bugs fixes for
group.getClientRect()
Konva.Arrow
will not draw dash for pointers- setAttr will trigger change event if new value is the same Object
- better behavior of
dblclick
event when you click fast on different shapes stage.toDataURL
will usepixelRatio = 1
by default.
- Even more bugs fixes for
Konva.Transformer
- Several bugs fixes for
Konva.Transformer
- new
Konva.Transformer
. It is a special group that allow simple resizing and rotation of a shape. - Add ability to remove event by callback
node.off('event', callback)
. - new
Konva.Filters.Contrast
. - new
Konva.Util.haveIntersection()
to detect simple collusion - add
Konva.Text.ellipsis
to add '…' to text string if width is fixed and wrap is set to 'none' - add gradients for strokes
- stage events are slightly changed.
mousedown
,click
,mouseup
,dblclick
,touchstart
,touchend
,tap
,dbltap
will be triggered when clicked on empty areas too
- Some typescript fixes
- Pixelate filter fixes
- Fixes for path data parsing
- Fixed shadow size calculation
- Some deprecated methods are removed. If previous version was working without deprecation warnings for you, this one will work fine too.
- Some typescript fixes
isBrowser
detection for electron
- Changing size of a stage will redraw it in synchronous way
- Some fixes special for nodejs
- Fixed
Konva.document is undefined
- Konva for browser env and Konva for nodejs env are separate packages now. You can use
konva-node
for NodeJS env.
- Several typescript fixes
- Default value for
dragDistance
is changed to 3px. - Fix rare error throw on drag
- Caching with height = 0 or width = 0 with throw async error. Caching will be ignored.
- The
node.getClientRect()
calculation is changed a bit. It is more powerfull and correct. Also it takes parent transform into account. See docs. - Upgrade nodejs deps
- Fix bug with double trigger wheel in Firefox
- Fix
node.getClientRect()
calculation in a case of Group + invisible child - Fix dblclick issue #252
- Fixed bug with pointer detection. css 3d transformed stage will not work now.
- Fixed bug with automatic shadow for negative scale values
- Fix pointer position detection
- moved
globalCompositeOperation
property toKonva.Node
- support of globalCompositeOperation for
Konva.Shape
- getAllIntersections now works ok for Text shapes (#224)
- Konva a bit changed a way to detect pointer position. Now it should be OK to apply css transform on Konva container. #215
- support for
lineDashOffset
property forKonva.Shape
.
textDecoration
ofKonva.Text
now supportsline-through
- new align value for
Konva.Text
andKonva.TextPath
:justify
- new property for
Konva.Text
andKonva.TextPath
:textDecoration
. Right now it sports only '' (no decoration) and 'underline' values. - new property for
Konva.Text
:letterSpacing
- new event
contentContextmenu
forKonva.Stage
align
support forKonva.TextPath
- new method
toCanvas()
for converting a node into canvas element
- changing a size of
Konva.Stage
will update it in async way (viabatchDraw
). shadowOffset
respect pixel ratio now
- Fixed bug when
Konva.Tag
width was not changing its width dynamically - Fixed "calling remove() for dragging shape will throw an error"
- Fixed wrong opacity level for cached group with opacity
- More consistent shadows on HDPI screens
- Fixed memory leak for nodes with several names
- refresh stage hit and its
dragend
getClientRect
calculations
- new properties for
Konva.TextPath
:letterSpacing
andtextBaseline
.
- Prevent throwing an error when text property of
Konva.Text
= undefined or null
- Better hit function for
TextPath
. - Validation of
Shape
filters.
- Fixed "Dragging Group on mobile view throws "missing preventDefault" error" #169
- Fixed #166 bug of drag&drop
- new property of
Konva.Shape
-preventDefault
.
- Fixed some typescript definitions
Konva.Text
will interpret undefinedwidth
andheight
asAUTO
- you can now unset property by
node.x(undefined)
ornode.setAttr('x', null)
- Bug fix for case when
touchend
event throws error
- Bug fix for case when
touchend
event throws error
- Custom clip function
- fixes in typescript definitions
- fixes for bug with
mouseenter
event on deep nesting case
- typescript definition in npm package
- node@5.10.1, canvas@1.3.14, jsdom@8.5.0 support
Konva.Path
will be filled when it is not closedAnimation.start()
will not not immediate sync draw. This should improve performance a little.- Warning when node for
Tween
is not in layer yet. removeChildren()
remove only first level children. So it will not remove grandchildren.
batchDraw
will do not immediatedraw()
- fix incorrect shadow offset on rotation
batchDraw
function works less time now- lighter npm package
- repair
cancelBubble
event property behaviour - fix wrong
Path
getClientRect()
calculation - better HDPI support
- better typescript definitions
- node 0.12 support
- more universal stage container selector
mousewheel
event changed towheel
- correct
Konva.Arrow
drawing. Now it works better. - Better support for dragging when mouse out of stage
- Better corner radius for
Label
shape contentTap
event for stage
- event delegation. You can use it in this way:
layer.on('click', 'Circle', handler);
- new
node.findAncestors(selector)
andnode.findAncestor(selector)
functions - optional selector parameter for
stage.getIntersection
andlayer.getIntersection
- show warning message if several instances of Konva are added to page.
moveTo
and some other methods returnthis
getAbsolutePosition
support optional relative parent argument (useful to find absolute position inside of some of parent nodes)change
event will be not fired if changed value is the same as old value
- RGBA filter. Thanks to @codefo
stroke
andfill
support forKonva.Sprite
- Correct calculation in
getClientRect
method ofKonva.Line
andKonva.Container
. - Correct
toObject()
behaviour for node with attrs with extended native prototypes - Fixed bug for caching where buffer canvas is required
- Dragging works much better. If your pointer is out of stage content dragging will still continue.
Konva.Node.create
now works with objects.Konva.Tween
now supports tweening points to state with different length
to
will not throw error if noonFinish
callback- HDPI support for desktop
- Fix bug when filters are not correct for HDPI
- Fix bug when hit area is not correct for HDPI
- Fix bug for incorrect
getClientRect
calculation - Repair fill gradient for text
- context wrapper is more capable with native context.
So you can use
context.fillStyle
property in yoursceneFunc
without accessing native context. toDataURL
now handles pixelRatio. you can passconfig.pixelRatio
argument- Correct
clone()
for custom nodes FastLayer
can now have transformsstage.toDataURL()
method now works synchronously. Socallback
argument is not required.container.find(selector)
method now has a validation step. So if you forgot to add#
or.
you will see a warning message in the console.
- new
Konva.Image.fromURL
method
fillRed
,fillGreen
,fillBlue
,fillAlpha
are deprecated. Usefill
instead.strokeRed
,strokeGreen
,strokeBlue
,strokeAlpha
are deprecated. Usestroke
instead.shadowRed
,shadowGreen
,shadowBlue
,shadowAlpha
are deprecated. Useshadow
instead.dashArray
is deprecated. Usedash
instead.drawFunc
is deprecated. UsesceneFunc
instead.drawHitFunc
is deprecated. UsehitFunc
instead.rotateDeg
is deprecated. Userotate
instead.
- cache algorithm has A LOT OF updates.
scale
now affectsshadowOffset
- performance optimization (remove some unnecessary draws)
- more expected drawing when shape has opacity, stroke and shadow
- HDPI for caching.
- Cache should work much better. Now you don't need to pass bounding box {x,y,width,height} to
cache
method for all buildin Konva shapes. (only for your customKonva.Shape
instance). Tween
now supports color properties (fill
,stroke
,shadowColor
)
- new methods for working with node's name:
addName
,removeName
,hasName
. - new
perfectDrawEnabled
property for shape. See http://konvajs.org/docs/performance/Disable_Perfect_Draw.html - new
shadowForStrokeEnabled
property for shape. See http://konvajs.org/docs/performance/All_Performance_Tips.html - new
getClientRect
method. - new
to
method for every node for shorter tweening
- Bug Fixes
- browser crashing on pointer events fixed
- optimized
getIntersection
function
- Enhancements
container.findOne()
method- new
strokeHitEnabled
property. Useful for performance optimizations - typescript definitions. see
/resources/konva.d.ts
Differences from last official KineticJS
release
-
Bug Fixes
strokeScaleEnabled = false
is disabled for text as I can not find a way to implement thisstrokeScaleEnabled = false
for Line now creates a correct hit graph- working "this-example" as name for nodes
- Konva.Text() with no config will not throw exception
- Konva.Line() with no config will not throw exception
- Correct stage resizing with
FastLayer
batchDraw
method forFastLayer
- Correct mouseover/mouseout/mouseenter/mouseleave events for groups
- cache node before adding to layer
intersects
function now works for shapes with shadow
-
Enhancements
cornerRadius
of Rect is limited bywidth/2
andheight/2
black
is default fill for text- true class extending. Now
rect instanceOf Konva.Shape
will return true - while dragging you can redraw layer that is not under drag. hit graph will be updated in this case
- now you can move object that is dragging into another layer.
- new
frameOffsets
attribute forKonva.Sprite
- much better dragging performance
browserify
support- applying opacity to cached node
- remove all events with
node.off()
- mouse dragging only with left button
- opacity now affects cached shapes
- Label corner radius
- smart changing
width
,height
,radius
attrs for circle, start, ellipse, ring. mousewheel
support. Thanks @vmichnowicz- new Arrow plugin
- multiple names:
node.name('foo bar'); container.find('.foo');
(thanks @mattslocum) Container.findOne()