05 canvas——Konva简单使用
Posted Nicole
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了05 canvas——Konva简单使用相关的知识，希望对你有一定的参考价值。
konva使用模板
<title>konva使用模板</title> <style> body{ padding: 0; margin:0; background-color: #f0f0f0; } </style> <script src="bower_components/konva/konva.js"></script> </head> <body> <!--放我们的舞台--> <div id="container"> </div>
<script>
//1、创建舞台
var stage = new Konva.Stage({
container:‘container‘,//id
width:window.innerWidth,//全屏
height:window.innerHeight
});
//2、创建一个层
var layer = new Konva.Layer();
//3、把层添加到舞台
stage.add(layer);
//4、创建一个矩形
var rect = new Konva.Rect({
x:100,
y:100,
opacity:.4,
rotation:40,
height:200,
width:100,
scaleX:1.2,
scaleY:1.2,
draggable:true,/*可拖动*/
fill:"orange"
});
//5、把矩形添加到层上去
layer.add(rect);
//6、把层渲染到舞台
layer.draw();
</script>
</body>以上是关于05 canvas——Konva简单使用的主要内容，如果未能解决你的问题，请参考以下文章
Android画图最基本的三个对象（Color，Paint，Canvas）