第三方的canvas库

第三方的canvas库

Konva

Konva特点

面向对象方式

  • 一切皆对象
  • 如何定义对象 ①Object构造函数 ②直接量 {} ③自定义构造函数 再new
  • 构造函数 new一个构造函数就可以得到对象(实例)
  • this
  • 原型 prototype / 原型链

konva概念

  • 舞台 stage
  • 层 layer
  • 组 group
  • 图形

基本操作

  • 创建舞台
    new Konva.Stage({
    width:
    height
    })
  • 创建层
    new Konval.Layer({})
    stage.add(layer)
  • 图形或组添加到 层
  • 图形添加到组
  • 绘制 layer.draw()

基本图形

  • Konva.Rect() 矩形
  • Konva.Circle() 圆形
  • Konva.Ellipse() 椭圆
  • Konva.Text() 文字
  • Konva.Image() 图片
  • Konva.Line() 划线
  • Konva.star() 星星
  • ....

事件

类似于jquery

动画

  • tween对象 指定动画持续时间 指定变化的样式 tween.play()
  • 简写 图形.to()
  • Animation对象
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容