首页 前端源码 基于canvas的纯JS二维码生成插件

基于canvas的纯JS二维码生成插件

2023-05-14 16:05:24 前端源码 前端哥 624 115 我要收藏
JS二维码生成插件下载地址: https://www.qianduange.cn/index.php/art/download/id/44.html

JS二维码生成插件是一款基于HTML5 Canvas的纯JS二维码生成插件。通过qrious.js可以快速生成各种二维码,你可以控制二维码的尺寸颜色,还可以将生成的二维码进行Base64编码。

引入必要文件

<script src="./js/qrious.min.js"></script>

HTML结构

<canvas id="qr"></canvas>

初始化插件

可以通过QRious()方法来实例化一个对象实例。

(function() {  const qr = new QRious({    element: document.getElementById('qr'),    value: 'https://www.qianduange.cn/'  })})()

配置参数

qrious.js二维码插件的可用配置参数如下:


参数类型默认值描述
backgroundString"white"二维码的背景颜色。
foregroundString"black"二维码的前景颜色。
levelString"L"二维码的误差校正级别(L, M, Q, H)。
mimeString"image/png"二维码输出为图片时的MIME类型。
sizeNumber100二维码的尺寸,单位像素。
valueString""需要编码为二维码的值

例如:


const qr = new QRious()qr.background = '#000'qr.foreground = '#fff'qr.level = 'H'qr.size = 500qr.value = 'https://www.qianduange.cn/'

或者在构造函数中传入:

const qr = new QRious({  background: '#000',  foreground: '#fff',  level: 'H',  size: 500,  value: 'https://www.qianduange.cn/'})

转载请注明出处或者链接地址:https://www.qianduange.cn/article/44.html
评论
会员中心 联系我 留言建议 回顶部
复制成功!