konva

2018-06-15 admin

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介绍、konva使用

</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>


# [](#loading-and-installing-konva)Loading and installing Konva

Konva supports UMD loading. So you can use all possible variants to load the framework into your project:

### [](#1-load-konva-via-classical-script-tag)1 Load Konva via classical `<script>` tag:

```text-html-basic
<script src="https://cdn.rawgit.com/konvajs/konva/1.7.3/konva.min.js">

本站文章除注明转载外,均为本站原创或编译。欢迎任何形式的转载,但请务必注明出处。

转载请注明:文章转载自 JavaScript中文网 [https://www.javascriptcn.com]

本文地址:https://www.javascriptcn.com/read-34092.html

文章标题:konva

回到顶部