Konva.js 介绍
Konva是 一个 html5 Canvas JavaScript框架,它可以轻松的实现桌面应用和移动应用中的图形交互交互 效果 ,可以高效的实现动画,变换,节点嵌套,局部操作,滤镜,缓存,事件等 功能 ,不仅仅适用于桌面与移动开发,还有更为广泛的应用。
Konva允许在舞台上绘图, 添加 事件监听,移动或缩放某个图形,独立旋转,以及高效的动画. 即使应用中含有数千个图形也是可以轻松实现的。
安装
npm install konva --save
使用
<script src="https://unpkg.com/konva@3.1.0/konva.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',
stroke Width: 4,
draggable: true
});
layer.add( Box );
layer.draw();
// add cursor styling
Box .on('mou SEO ver',function() {
document.body.style.cursor = 'pointer';
});
Box .on('mou SEO ut',function() {
document.body.style.cursor = 'default';
});
</script>
网站地址 : http://konvajs.org/
GitHub: https://github.com/konvajs/konva
网站描述: 一个 基于 Canvas 开发的 2d js 框架库
Konva.js官方网站
官方网站: http://konvajs.org/
如果觉得 网站内容还不错,欢迎将 网站 推荐给程序员好友。