给通过canvas生成的二维码添加logo
以jquery.qrcode为例来说,
生成二维码代码:
依赖jquery.js, jquery.qrcode.js
//计算宽,高,中心坐标,logo大小
var width = 256,height = 256;
var x = width * 0.4,
y = height * 0.4,
lx = width * 0.2,
ly = height * 0.2;
$('#div')
.qrcode({
render : "canvas",
width: width,
height: height,
text: ‘this is content’
})
.hide();
var canvas = $("#div canvas")[0];
//添加logo
canvas.getContext('2d').drawImage($("#qrCodeIco")[0], x, y, lx, ly);
//将canvas生成的二维码内容添加到img里,使得移动端能长按识别二维码
$('#image').attr('src', canvas.toDataURL('image/png'));
<div id="div"></div>
<img id="qrCodeIco" src="logo.png" style="display:none;"/>
<img id="image" src="" alt="code"/>
给通过canvas生成的二维码添加logo的更多相关文章
- 给二维码(图片)添加文字(水印),让生成的二维码中间带logo
<?php //生成二维码 require_once IA_ROOT . '/framework/library/qrcode/phpqrcode.php'; QRcode::png($url, ...
- PHP二维码添加logo的方法
PHP二维码添加logo的方法<pre> public function createqcode($text,$id){ include '/phpqrcode/phpqrcode.php ...
- Java生成微信二维码及logo二维码
依赖jar包 二维码的实现有多种方法,比如 Google 的 zxing 和日本公司的 QrCode,本文以 QrCode 为例. QrCode.jar:https://pan.baidu.com/s ...
- 微信二维码添加logo
生成带参数的二维码 为了满足用户渠道推广分析和用户帐号绑定等场景的需要,公众平台提供了生成带参数二维码的接口.使用该接口可以获得多个带不同场景值的二维码,用户扫描后,公众号可以接收到事件推送. 目前有 ...
- vue生成条形码/二维码/带logo二维码
条形码:https://blog.csdn.net/dakache11/article/details/83749410 //安装 cnpm install @xkeshi/vue-barcode / ...
- 二维码项目实例为二维码添加logo
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- Android生成自定义二维码
前面说过两种二维码扫描方式,现在说如何生成自定义酷炫二维码.二维码生成需要使用Google开源库Zxing,Zxing的项目地址:https://github.com/ZBar/ZBar,我们只需要里 ...
- Java使用ZXing生成/解析二维码图片
ZXing是一种开源的多格式1D/2D条形码图像处理库,在Java中的实现.重点是在手机上使用内置摄像头来扫描和解码设备上的条码,而不与服务器通信.然而,该项目也可以用于对桌面和服务器上的条形码进行编 ...
- vue 把后端返回的图片和url链接生成的二维码用canvas 合成一张图片
H5 页面在做某个活动的时候,有两种分享方式,一种是链接分享,一种是图片分享. 链接分享的话,如果是在微信里,就可引导用户利用微信浏览器自带的分享,根据sdk设置分享标题简介链接缩略图即可. 图片分享 ...
随机推荐
- python开发笔记-DataFrame的使用
今天详细做下关于DataFrame的使用,以便以后自己可以翻阅查看 DataFrame的基本特征: 1.是一个表格型数据结构 2.含有一组有序的列 3.大致可看成共享同一个index的Series集合 ...
- 洛谷:P1783 海滩防御(二分+并查集 最短路 最小生成树)
题意: 给定长度为N的海滩,然后有M做防御塔,给出每座塔的位置Xi,到海岸的距离Yi. 求防御塔上最小观测半径Ri,使得海滩被封锁. 思路:要使左边界和右边界连通. 很nice,可以二分+并查集做. ...
- Linux下TCP连接断开后不释放的解决办法
问题:在开发测试时发现断开与服务器端口后再次连接时拒绝连接. 分析:服务器上查看端口占用情况,假设端口为8888. netstat -anp |grep 8888 发现端口8888端口显示被占用(ip ...
- Access数据库连接封装类
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.D ...
- mariadb启动不了
提示地址已经被使用,是否有其他的进程正在使用 /var/run/sdata/mysql.sock 查询该文件,发现没有,sdata目录都不存在,应该是上次mysql意外关闭导致这个目录丢失了, 使用r ...
- 3、kafka工作流程
一.kafka各成员 kafka: 分布式消息系统,将消息直接存入磁盘,默认保存一周. broker: 组成kafka集群的节点,之间没有主从关系,依赖zookeeper来协调,broker负责满息的 ...
- Android Studio3.0的下载及其安装详解加eclipse下载安装配置jdk9
关注我,每天都有优质技术文章推送,工作,学习累了的时候放松一下自己. 本篇文章同步微信公众号 欢迎大家关注我的微信公众号:「醉翁猫咪」 今天我们来讲解如何下载android studio 3.0及其 ...
- pip崩了, 解决 ModuleNotFoundError: No module named 'pip'.
今天 在windows下用pip 安装数据库模块pymysql 把pip 弄崩了,直接出现下面的错误.都是红字, 再输入pip install pymysql ,会报错ModuleNotFound ...
- 深入理解数据库索引采用B树和B+树的原因
前面几篇关于数据库底层磁盘文件读取,数据库索引实现细节进行了深入的研究,但是没有串联起来的讲解为什么数据库索引会采用B树和B+树而不是其他的数据结构,例如平衡二叉树.链表等,因此,本文打算从数据库文件 ...
- 用Visual Studio编写UDF的一点小技巧(二)