Update README.md

This commit is contained in:
Anton Lavrenov 2015-11-06 22:26:21 +06:00
parent 96a8671fa5
commit a2e93b214f

View File

@ -1,3 +1,5 @@
![Konva logo](https://raw.githubusercontent.com/konvajs/konvajs.github.io/master/apple-touch-icon-180x180.png)
#Konva #Konva
Konva is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more. Konva is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more.
@ -15,6 +17,50 @@ This repository began as a GitHub fork of [ericdrowell/KineticJS](https://github
* **Discover:** [Tutorials](http://konvajs.github.io/docs), [API Documentation](http://konvajs.github.io/docs) * **Discover:** [Tutorials](http://konvajs.github.io/docs), [API Documentation](http://konvajs.github.io/docs)
* **Help:** [StackOverflow](http://stackoverflow.com/questions/tagged/konvajs) * **Help:** [StackOverflow](http://stackoverflow.com/questions/tagged/konvajs)
# Quick Look
```html
<script src="https://cdn.rawgit.com/konvajs/konva/0.10.0/konva.min.js"></script>
<div id="container"></div>
<script>
var stage = new Konva.Stage({
container: 'container',
width: window.innerWidth,
height: window.innerHeight
});
// add canvas element
var layer = new Konva.Layer();
stage.add(layer);
// create shape
var box = new Konva.Rect({
x: 50,
y: 50,
width: 100,
height: 50,
fill: '#00D2FF',
stroke: 'black',
strokeWidth: 4,
draggable: true
});
layer.add(box);
layer.draw();
// add cursor styling
box.on('mouseover', function() {
document.body.style.cursor = 'pointer';
});
box.on('mouseout', function() {
document.body.style.cursor = 'default';
});
</script>
```
#Installation #Installation
* `bower install konva` * `bower install konva`