canvas继承vue组件 (vue使用canvas教程)

日常开发中,经常会生成分享海报,基于vue运行时的vue-canvas-poster组件不失为一个不错的轮子,拿来主义也挺好!

vue有哪些canvas插件,vue使用canvas教程

Vue Canvas Poster

Vue Canvas Poster 一个通过 css 属性画 canvas 图片的轻量级的 vue 组件。 (A lightweight vue components use canvas draw image by css properties.)

Vue Canvas Poster 文档

主要特性:

  • 绘制文本(换行、超出内容省略号、中划线、下划线、文本加粗、文字缩进)
  • 绘制图片(圆角、旋转、边框、模式:类似小程序 image mode)
  • 绘制矩形(圆角、旋转、边框)
  • 绘制二维码
  • 渐变
  • 阴影

为什么使用 vue-canvas-poster

简单: 使用类css属性的方式生成canvas图。 易用: 通过npm安装,简单上手 。 无依赖: 无其他依赖库。 高清: 可以通过 widthPixels 设置生成图片尺寸,解决图片模糊问题。

使用说明

import { VueCanvasPoster } from 'vue-canvas-poster'

文档地址:https://sunniejs.github.io/vue-canvas-poster/#/README

vue有哪些canvas插件,vue使用canvas教程