mirror of
https://github.com/konvajs/konva.git
synced 2026-01-09 11:34:38 +08:00
fix array serialization. fix #576
This commit is contained in:
7
konva.js
7
konva.js
@@ -8,7 +8,7 @@
|
||||
* Konva JavaScript Framework v3.0.0-0
|
||||
* http://konvajs.github.io/
|
||||
* Licensed under the MIT
|
||||
* Date: Wed Feb 06 2019
|
||||
* Date: Mon Feb 11 2019
|
||||
*
|
||||
* Original work Copyright (C) 2011 - 2013 by Eric Rowell (KineticJS)
|
||||
* Modified work Copyright (C) 2014 - present by Anton Lavrenov (Konva)
|
||||
@@ -3506,8 +3506,9 @@
|
||||
for (key in attrs) {
|
||||
val = attrs[key];
|
||||
// if value is object and object is not plain
|
||||
// like class instance, we should skip it and to not inclide
|
||||
nonPlainObject = Util.isObject(val) && !Util._isPlainObject(val);
|
||||
// like class instance, we should skip it and to not include
|
||||
nonPlainObject =
|
||||
Util.isObject(val) && !Util._isPlainObject(val) && !Util._isArray(val);
|
||||
if (nonPlainObject) {
|
||||
continue;
|
||||
}
|
||||
|
||||
4
konva.min.js
vendored
4
konva.min.js
vendored
File diff suppressed because one or more lines are too long
@@ -1308,8 +1308,9 @@ export abstract class Node {
|
||||
for (key in attrs) {
|
||||
val = attrs[key];
|
||||
// if value is object and object is not plain
|
||||
// like class instance, we should skip it and to not inclide
|
||||
nonPlainObject = Util.isObject(val) && !Util._isPlainObject(val);
|
||||
// like class instance, we should skip it and to not include
|
||||
nonPlainObject =
|
||||
Util.isObject(val) && !Util._isPlainObject(val) && !Util._isArray(val);
|
||||
if (nonPlainObject) {
|
||||
continue;
|
||||
}
|
||||
|
||||
78
test/sandbox2.html
Normal file
78
test/sandbox2.html
Normal file
@@ -0,0 +1,78 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
<script src="../../konva.min.js"></script>
|
||||
<meta charset="utf-8" />
|
||||
<title>Konva Canvas Scrolling Demo</title>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
background-color: #f0f0f0;
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
#large-container {
|
||||
width: 3000px;
|
||||
height: 3000px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
#scroll-container {
|
||||
width: calc(100% - 22px);
|
||||
height: calc(100vh - 22px);
|
||||
overflow: auto;
|
||||
margin: 10px;
|
||||
border: 1px solid grey;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="scroll-container">
|
||||
<div id="large-container"><div id="container"></div></div>
|
||||
</div>
|
||||
<script>
|
||||
var WIDTH = 3000;
|
||||
var HEIGHT = 3000;
|
||||
var NUMBER = 200;
|
||||
|
||||
var stage = new Konva.Stage({
|
||||
container: 'container',
|
||||
width: window.innerWidth,
|
||||
height: window.innerHeight
|
||||
});
|
||||
|
||||
var layer = new Konva.Layer();
|
||||
stage.add(layer);
|
||||
|
||||
function generateNode() {
|
||||
return new Konva.Circle({
|
||||
x: WIDTH * Math.random(),
|
||||
y: HEIGHT * Math.random(),
|
||||
radius: 50,
|
||||
fill: 'red',
|
||||
stroke: 'black'
|
||||
});
|
||||
}
|
||||
|
||||
for (var i = 0; i < NUMBER; i++) {
|
||||
layer.add(generateNode());
|
||||
}
|
||||
layer.draw();
|
||||
|
||||
var scrollContainer = document.getElementById('scroll-container');
|
||||
scrollContainer.addEventListener('scroll', function() {
|
||||
var dx = scrollContainer.scrollLeft;
|
||||
var dy = scrollContainer.scrollTop;
|
||||
stage.container().style.transform =
|
||||
'translate(' + dx + 'px, ' + dy + 'px)';
|
||||
stage.x(-dx);
|
||||
stage.y(-dy);
|
||||
stage.batchDraw();
|
||||
});
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -2538,7 +2538,8 @@ suite('Node', function() {
|
||||
stroke: 'black',
|
||||
strokeWidth: 4,
|
||||
name: 'myCircle',
|
||||
draggable: true
|
||||
draggable: true,
|
||||
dash: [5, 5]
|
||||
});
|
||||
|
||||
stage.add(layer);
|
||||
@@ -2547,7 +2548,7 @@ suite('Node', function() {
|
||||
layer.draw();
|
||||
|
||||
var expectedJson =
|
||||
'{"attrs":{"x":289,"y":100,"radius":70,"fill":"green","stroke":"black","strokeWidth":4,"name":"myCircle","draggable":true},"className":"Circle"}';
|
||||
'{"attrs":{"x":289,"y":100,"radius":70,"fill":"green","stroke":"black","strokeWidth":4,"name":"myCircle","draggable":true,"dash":[5,5]},"className":"Circle"}';
|
||||
|
||||
assert.equal(circle.toJSON(), expectedJson);
|
||||
});
|
||||
|
||||
@@ -45,5 +45,9 @@ suite('Filter', function() {
|
||||
layer.draw();
|
||||
|
||||
var json = circle.toJSON();
|
||||
|
||||
var newCircle = Konva.Node.create(json);
|
||||
|
||||
assert.deepEqual(newCircle.filters(), [Konva.Filters.Blur]);
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user