以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的更多相关文章

  1. 给二维码(图片)添加文字(水印),让生成的二维码中间带logo

    <?php //生成二维码 require_once IA_ROOT . '/framework/library/qrcode/phpqrcode.php'; QRcode::png($url, ...

  2. PHP二维码添加logo的方法

    PHP二维码添加logo的方法<pre> public function createqcode($text,$id){ include '/phpqrcode/phpqrcode.php ...

  3. Java生成微信二维码及logo二维码

    依赖jar包 二维码的实现有多种方法,比如 Google 的 zxing 和日本公司的 QrCode,本文以 QrCode 为例. QrCode.jar:https://pan.baidu.com/s ...

  4. 微信二维码添加logo

    生成带参数的二维码 为了满足用户渠道推广分析和用户帐号绑定等场景的需要,公众平台提供了生成带参数二维码的接口.使用该接口可以获得多个带不同场景值的二维码,用户扫描后,公众号可以接收到事件推送. 目前有 ...

  5. vue生成条形码/二维码/带logo二维码

    条形码:https://blog.csdn.net/dakache11/article/details/83749410 //安装 cnpm install @xkeshi/vue-barcode / ...

  6. 二维码项目实例为二维码添加logo

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  7. Android生成自定义二维码

    前面说过两种二维码扫描方式,现在说如何生成自定义酷炫二维码.二维码生成需要使用Google开源库Zxing,Zxing的项目地址:https://github.com/ZBar/ZBar,我们只需要里 ...

  8. Java使用ZXing生成/解析二维码图片

    ZXing是一种开源的多格式1D/2D条形码图像处理库,在Java中的实现.重点是在手机上使用内置摄像头来扫描和解码设备上的条码,而不与服务器通信.然而,该项目也可以用于对桌面和服务器上的条形码进行编 ...

  9. vue 把后端返回的图片和url链接生成的二维码用canvas 合成一张图片

    H5 页面在做某个活动的时候,有两种分享方式,一种是链接分享,一种是图片分享. 链接分享的话,如果是在微信里,就可引导用户利用微信浏览器自带的分享,根据sdk设置分享标题简介链接缩略图即可. 图片分享 ...

随机推荐

  1. 如何使用keil5将stm32的hal库编译成lib文件——F1版本

    hal库中keil5中编译的速度是比较慢的,相同情况下,每次都要编译的时候,比标准库是要慢很多的,因此就hal库编译成lib文件是一种加快编译速度的方法,当然也有其自身的缺点.一.步骤1.使用cube ...

  2. DNS隧道

    自己使用的dns隧道通过两种方法,一种是通过dnscat2工具,另一种通过cs上的beacon来进行通信. 第一种方法:dnscat2: 参考文章:https://xz.aliyun.com/t/22 ...

  3. LeetCode 742. Closest Leaf in a Binary Tree

    原题链接在这里:https://leetcode.com/problems/closest-leaf-in-a-binary-tree/ 题目: Given a binary tree where e ...

  4. CollectionUtils.select用法

    import java.util.ArrayList;import java.util.List; import org.apache.commons.collections.CollectionUt ...

  5. Windows本机调试内部组件

    将详细分析Windows调试的本机接口.希望读者对C和通用NT内核体系结构和语义有一些基本的了解.此外,这并不是介绍什么是调试或如何编写调试器.它可以作为经验丰富的调试器编写人员或好奇的安全专家的参考 ...

  6. testinfra 基础设施测试工具

    testinfra 是基于python 开发的基础设施测试工具,我们可以用来方便的测试基础设施 是否符合我们的要求(系统,软件...) 一个参考demo   def test_passwd_file( ...

  7. hasura graphql-engine 最近版本的一些更新

    好久没有在关注hasura graphql-engine 了,从最新的release 信息可以看到graphql-engine 已经beta 阶段了,而且目前是v1.0.0-beta.2 估计离生产可 ...

  8. 【loj2983】【WC2019】数树

    题目 两颗\(n\)个点的树T1和T2,有\(y\)种颜色; 现在给每个点染色,要求公共边端点的颜色相同,求: ​ 1.op=0 , T1和T2都确定,求合法染色方案数: ​ 2.op=1 , T1确 ...

  9. C博客作业01--分支顺序结构

    1.展示PTA总分 2.本章学习总结 ①C语言数据类型 ② if-else语句 if (条件) { 语句A; } else { 语句B; } 在if (条件)后不加":" 要用&q ...

  10. .Net Core NOPI操作word(一)

    NOPI使用方式 1.安装nuget包 即可使用 Install-Package NPOI 一.创建word文档 //创建生成word文档 string path = "D:\\test.d ...