lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-11-24 08:46:44 +08:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

fix array serialization. fix #576

Browse Source
This commit is contained in:
Anton Lavrenov
2019-02-11 08:46:34 -05:00
parent 12fbe870bd
commit 128b5b403e
6 changed files with 94 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

78
test/sandbox2.html Normal file
View 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>

5
test/unit/Node-test.js
View File

@@ -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);
});

4
test/unit/filters/Filter-test.js
View File

@@ -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]);
});
});