lsm/konva
1
0
Fork 0
mirror of https://github.com/konvajs/konva.git synced 2025-04-05 20:48:28 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

update docs

Browse Source
This commit is contained in:
Anton Lavrenov 2016-10-25 09:03:25 -06:00
parent 34d40d57e7
commit b12fd40f25
3 changed files with 17 additions and 66 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
CHANGELOG.md
View File

@ -6,6 +6,7 @@ This project adheres to [Semantic Versioning](http://semver.org/).
## Added ## Added
- new properties for `Konva.Text`: `letterSpacing` - new properties for `Konva.Text`: `letterSpacing`
- new event `contentContextmenu` for `Konva.Stage`
### Changed ### Changed
- changing a size of `Konva.Stage` will update it in async way (via `batchDraw`). - changing a size of `Konva.Stage` will update it in async way (via `batchDraw`).

2
src/Node.js
View File

@ -384,7 +384,7 @@
* bind events to the node. KonvaJS supports mouseover, mousemove, * bind events to the node. KonvaJS supports mouseover, mousemove,
* mouseout, mouseenter, mouseleave, mousedown, mouseup, wheel, click, dblclick, touchstart, touchmove, * mouseout, mouseenter, mouseleave, mousedown, mouseup, wheel, click, dblclick, touchstart, touchmove,
* touchend, tap, dbltap, dragstart, dragmove, and dragend events. The Konva Stage supports * touchend, tap, dbltap, dragstart, dragmove, and dragend events. The Konva Stage supports
* contentMouseover, contentMousemove, contentMouseout, contentMousedown, contentMouseup, contentWheel * contentMouseover, contentMousemove, contentMouseout, contentMousedown, contentMouseup, contentWheel, contentContextmenu
* contentClick, contentDblclick, contentTouchstart, contentTouchmove, contentTouchend, contentTap, * contentClick, contentDblclick, contentTouchstart, contentTouchmove, contentTouchend, contentTap,
* and contentDblTap. Pass in a string of events delimmited by a space to bind multiple events at once * and contentDblTap. Pass in a string of events delimmited by a space to bind multiple events at once
* such as 'mousedown mouseup mousemove'. Include a namespace to bind an * such as 'mousedown mouseup mousemove'. Include a namespace to bind an

80
test/test.html
View File

@ -8,28 +8,10 @@
overflow: hidden; overflow: hidden;
background-color: #F0F0F0; background-color: #F0F0F0;
} }
#buttons {
position: absolute;
top: 5px;
left: 10px;
}
#buttons > input {
padding: 10px;
display: block;
margin-top: 5px;
}
</style> </style>
</head> </head>
<body> <body>
<div id="container"></div> <div id="container"></div>
<div id="buttons">
<button id="save">
Save as image
</button>
</div>
<script src="../dist/konva-dev.js"></script> <script src="../dist/konva-dev.js"></script>
<script> <script>
@ -46,55 +28,23 @@ height: height
}); });
var layer = new Konva.Layer(); var layer = new Konva.Layer();
layer.add(new Konva.Rect({
var rectX = stage.getWidth() / 2 - 50; width: 100,
var rectY = stage.getHeight() / 2 - 25; height: 100,
fill: 'red'
(function() { }))
for (var i = 0; i < 50; i++) {
layer.add(new Konva.Rect({
x: i * 50,
y: 0,
width: 50,
height: 10000,
fill: Konva.Util.getRandomColor()
}));
}
})();
var box = new Konva.Rect({
x: rectX,
y: rectY,
width: 100,
height: 50,
fill: '#00D2FF',
stroke: 'black',
strokeWidth: 4,
draggable: true
});
box.on('mouseover', function() {
document.body.style.cursor = 'pointer';
});
box.on('mouseout', function() {
document.body.style.cursor = 'default';
});
layer.add(box);
layer.draw();
stage.add(layer); stage.add(layer);
function exportCanvas() { // stage.getContent().addEventListener('contextmenu', function(e) {
var dataURL = stage.toDataURL({ //
width: 1500, // console.log('menu');
height: 1000, // e.preventDefault();
// pixelRatio: 2 // return false;
}); // });
window.open(dataURL); stage.on('contentContextmenu', function(e) {
} console.log(e.evt.preventDefault());
console.log('context click');
document.getElementById('save').addEventListener('click', exportCanvas, false); });
</script> </script>
</body> </body>
</html> </html>