下载Excel模板并填写信息
选择要生成的二维码样式
上传文档制作并完成下载
简约 ● 不简单
二维码批量制作多行业解决方案
1. Excel批量导入，既方便又通用；
2. 适用于嘉宾证、参会证、工作证、会员卡等各类证件中的二维码；
3. 采用短网址技术，让二维码更简洁易识别；
4. 头像、LOGO、彩色二维码，让您与众不同；
5. 为您的每一位员工或同事制作一张个性二维码名片吧！
按照Excel文档模板格式录入信息。完成后保存并记住文档的本地地址，以便上传。
二维码图片
自定义美化
设置二维码的前、背景色，注意前、背景色的对比度，过于接近将不易识别
前景图片：
背景图片：
前景颜色：
背景颜色：
眼睛外圈：
眼睛内圈：
二维码纠错率
（纠错率越高二维码识别率越高）
文档上传须知
1. 请正确填写模版，每次最多生成100个二维码
2.为保证二维码能够正常生成，请上传按模板格式生成的Excel文档。
3.若有大批量二维码制作需求请联系陈经理微信:（qq与微信同号）
4.如若遇到上传按钮上传不了，并点击上传制作无反应时候，请点击域名旁边的感叹号，找到flash，选择允许。
5、专业提供批量背景图与二维码完美融合，有需求请联系微信：
本工具已成功在线生成张个性二维码
当前进度：
恭喜！二维码制作成功！点击下载文件按钮即可下载
如果您也喜欢我们的，分享吧！
二维码软件定制(商务合作)： 陈经理
Copyright & 2013
版权所有 闽ICP备如何两步快速换图替换样式中的图片和二维码？
小蚂蚁编辑器的素材库中包含了上万款素材样式，绝大多数样式都有精美的配图。普通的换图方式为：点击图片，选择“换图”。使用此方法替换文章中的每一张图片，操作步骤繁多。尤其是在文章中存在较多图片时，换图往往成为一个费时费力的“大工程”。而在新版小蚂蚁编辑器中，替换文章内的图片仅需两步！与传统替换方法相比，操作更加简单直观！一、批量上传图片在换图前，我们需要先准备好需要添加到文章中的图片，并批量上传到“我的图片”中。小蚂蚁编辑器共有1种单图上传方式及2种多图上传方式，详细介绍可参考：这里我们仅介绍最简单的一种多图上传方法！① 在“我的图片”中，点击“上传”→“点击选择图片”。②&按住Ctrl键可连续选中多张图片，单次最多可选40张。选择好需要上传的图片后，点击“确定”→“开始上传”。③ 图片底部出现上传进度条，等待图片上传完毕，即可进入下一步操作。二、图片替换①&添加带有图片的样式到编辑区；（点击图片查看大图）②&点击样式内的图片，再点击“我的图片”中刚刚上传好的图片。（点击图片查看大图）没错！文章中的每一张图片均可以使用上述方法进行图片的快速替换。仅需两步，轻松完成换图，图片替换从未如此简单！&使用该方法进行换图，操作更加简洁明了。在文章中有较多配图时，能大幅压缩图文编辑排版的时间。这个新技能你有没有get到？赶快编辑一篇文章试试吧！
?推荐阅读：
QQ在线客服
请提供详细的截图大图+文字说明您的问题，您也可以通过帮助文档寻找答案！
微信扫码查看帮助
扫码关注，获取各种排版小技巧，黑科技！
扫码查看帮助&>&把信息生成二维码再合成一张图片
把信息生成二维码再合成一张图片
上传大小：22KB
把信息生成二维码再合成一张图片
综合评分：0
{%username%}回复{%com_username%}{%time%}\
/*点击出现回复框*/
$(".respond_btn").on("click", function (e) {
$(this).parents(".rightLi").children(".respond_box").show();
e.stopPropagation();
$(".cancel_res").on("click", function (e) {
$(this).parents(".res_b").siblings(".res_area").val("");
$(this).parents(".respond_box").hide();
e.stopPropagation();
/*删除评论*/
$(".del_comment_c").on("click", function (e) {
var id = $(e.target).attr("id");
$.getJSON('/index.php/comment/do_invalid/' + id,
function (data) {
if (data.succ == 1) {
$(e.target).parents(".conLi").remove();
alert(data.msg);
$(".res_btn").click(function (e) {
var parentWrap = $(this).parents(".respond_box"),
q = parentWrap.find(".form1").serializeArray(),
resStr = $.trim(parentWrap.find(".res_area_r").val());
console.log(q);
//var res_area_r = $.trim($(".res_area_r").val());
if (resStr == '') {
$(".res_text").css({color: "red"});
$.post("/index.php/comment/do_comment_reply/", q,
function (data) {
if (data.succ == 1) {
var $target,
evt = e || window.
$target = $(evt.target || evt.srcElement);
var $dd = $target.parents('dd');
var $wrapReply = $dd.find('.respond_box');
console.log($wrapReply);
//var mess = $(".res_area_r").val();
var mess = resS
var str = str.replace(/{%header%}/g, data.header)
.replace(/{%href%}/g, 'http://' + window.location.host + '/user/' + data.username)
.replace(/{%username%}/g, data.username)
.replace(/{%com_username%}/g, data.com_username)
.replace(/{%time%}/g, data.time)
.replace(/{%id%}/g, data.id)
.replace(/{%mess%}/g, mess);
$dd.after(str);
$(".respond_box").hide();
$(".res_area_r").val("");
$(".res_area").val("");
$wrapReply.hide();
alert(data.msg);
}, "json");
/*删除回复*/
$(".rightLi").on("click", '.del_comment_r', function (e) {
var id = $(e.target).attr("id");
$.getJSON('/index.php/comment/do_comment_del/' + id,
function (data) {
if (data.succ == 1) {
$(e.target).parent().parent().parent().parent().parent().remove();
$(e.target).parents('.res_list').remove()
alert(data.msg);
//填充回复
function KeyP(v) {
var parentWrap = $(v).parents(".respond_box");
parentWrap.find(".res_area_r").val($.trim(parentWrap.find(".res_area").val()));
评论共有0条
VIP会员动态
热门资源标签
CSDN下载频道资源及相关规则调整公告V11.10
下载频道用户反馈专区
下载频道积分规则调整V1710.18
spring mvc+mybatis+mysql+maven+bootstrap 整合实现增删查改简单实例.zip
资源所需积分/C币
当前拥有积分
当前拥有C币
输入下载码
为了良好体验，不建议使用迅雷下载
把信息生成二维码再合成一张图片
会员到期时间：
剩余下载个数：
剩余积分：0
为了良好体验，不建议使用迅雷下载
积分不足！
资源所需积分/C币
当前拥有积分
您可以选择
程序员的必选
绿色安全资源
资源所需积分/C币
当前拥有积分
当前拥有C币
为了良好体验，不建议使用迅雷下载
资源所需积分/C币
当前拥有积分
当前拥有C币
为了良好体验，不建议使用迅雷下载
资源所需积分/C币
当前拥有积分
当前拥有C币
您的积分不足，将扣除 10 C币
为了良好体验，不建议使用迅雷下载
无法举报自己的资源
你当前的下载分为234。
你还不是VIP会员
开通VIP会员权限，免积分下载
你下载资源过于频繁，请输入验证码
您因违反CSDN下载频道规则而被锁定帐户，如有疑问，请联络:!
若举报审核通过，可返还被扣除的积分
被举报人：
请选择类型
资源无法下载 （ 404页面、下载失败、资源本身问题）
资源无法使用 （文件损坏、内容缺失、题文不符）
侵犯版权资源 （侵犯公司或个人版权）
虚假资源 （恶意欺诈、刷分资源）
含色情、危害国家安全内容
含广告、木马病毒资源
*投诉人姓名：
*投诉人联系方式：
*版权证明：
*详细原因：
把信息生成二维码再合成一张图片前端合成二维码与背景图片，批量导出ZIP下载
背景：需要生成很多的二维码，并且结合背景图片一起生成图片，批量下载到本地，提供给打印厂商进行打印。
方案1：后台合成，后台提供下载.
方案2：前端合成，前端提供下载。
我选择了方案2。这个方案减轻后台压力，也不用后台保存图片。前端随时可以根据数据生成图片，自己下载。
直接上代码(前端页面有部分是用JADE模板写的)
生成二维码+合成背景图+打包
script(type='text/javascript', src='http://cdn.staticfile.org/jquery.qrcode/1.0/jquery.qrcode.min.js')
script(src='http://gildas-lormeau.github.io/zip.js/demos/zip.js')
script(src='http://gildas-lormeau.github.io/zip.js/demos/mime-types.js')
script(type='text/javascript', src='/javascripts/ZipArchive.js')
//- script(type='text/javascript', src='/javascripts/canvas-to-blob')
//- 导出图片的起名规则，柜机二维码用 型号名字 + index ，柜机格子名字用
模型名字 型号名字 + cell +index ，压缩名用 型号名
//- 标题 todo
label(style={'visibility':'hidden','position':'absolute'})
var rowCount = document.getElementById("elementCount").innerHTML/1;
console.log('get row count = ',rowCount);
each rowValue,index in batchData
- var rowId = 'vmDiv_'+
label(style={'visibility':'hidden','position':'absolute'})= rowId
div(id=rowId ,qrCode = rowValue.qrcode , style={'visibility':'hidden','position':'absolute'})
- var rowcaId = 'vmCanvas_'+
label(style={'visibility':'hidden'})= rowcaId
//- if rowValue.qc_pos != "0,0,0,0"
canvas(id=rowcaId,back_img_url=rowValue.back_img_url,name=rowValue.name,qc_pos=rowValue.qc_pos,wd_pos=rowValue.wd_pos,wd=rowValue.numMark )
label= rowValue.qrcode
//- &script src="./javascripts/jspdf.debug.js"&&/script&
//- &script src="./javascripts/html2canvas.js"&&/script&
canvas(id='allImage')
var isDrawEnd = false;
$(function() {
$("#downloadPdf").click(function(){
if(!isDrawEnd){
//切换到新增页面
var modalname = document.getElementById('modalname').innerHTML;
zipArc.export(modalname);
function draw(){
let allWidth = 0;
let allHeight = 0;
let maginBetween = 20;
let compinedImageCount = 0;
let willComC = rowC
for(let i=0;i&rowCi++){
var index =
let rowId = 'vmDiv_'+
let rowcaId = 'vmCanvas_'+
let qrOrigin = document.getElementById(rowId);
let qrCompined = document.getElementById(rowcaId);
let img=new I
img.crossOrigin = 'anonymous';
img.src = qrCompined.getAttribute('back_img_url');
img.onload=function(){
console.log("img width=",img.width,';img height=',img.height);
var qc_pos = qrCompined.getAttribute("qc_pos");
var wd_pos = qrCompined.getAttribute("wd_pos");
var wd = qrCompined.getAttribute("wd");
var qrCode = qrOrigin.getAttribute("qrCode");
var qrPosAry = qc_pos.split(',');
var wdPosAry = wd_pos.split(',');
console.log('create qr id='+rowId+'qrOrigin='+qrOrigin);
$(`#${rowId}`).qrcode({
render: "canvas", //table方式
width: qrPosAry[2], //宽度
height:qrPosAry[2], //高度
text: qrCode, //任意内容
correctLevel:1,
//画二维码
var c = qrC
var ctx = c.getContext('2d');
c.width = img.
c.height = img.
//-ctx.rect(0,0,0,0);
ctx.rect(0,0,img.width,img.height);
ctx.fillStyle='red';
ctx.fill();
img.crossOrigin = 'anonymous';
ctx.drawImage(img,0,0,img.width,img.height);
allWidth = Math.max(allWidth,img.width);
allHeight = allHeight + img.height + maginB
//绘制二维码
qrOrigin.crossOrigin = 'anonymous';
ctx.drawImage(qrOrigin.firstChild,qrPosAry[0]/1,qrPosAry[1]/1,qrPosAry[2]/1,qrPosAry[3]/1);
//绘制序号
//设置字体样式
ctx.font = 'bold ' + wdPosAry[3]+'px FZDHTJW_0';
//设置字体填充颜色
console.log(wd_pos);
//- ctx.fillStyle='white';
//- ctx.fillRect(wdPosAry[0],wdPosAry[1],wdPosAry[2],wdPosAry[3]);
ctx.textAlign='center';
ctx.textBaseline="middle";
ctx.fillStyle = "black";
ctx.fillText(wd, parseInt(wdPosAry[0])+parseInt(wdPosAry[2])/2, parseInt(wdPosAry[1])+ parseInt(wdPosAry[3])/2 );
compinedImageCount++;
if(compinedImageCount == willComC){
//所有页面整合为一张
allImageTogether(allWidth,allHeight,maginBetween,compinedImageCount);
var zipArc = new ZipA
console.log('zipArc=',zipArc);
function allImageTogether(allWidth,allHeight,maginBetween,compinedImageCount){
var modalname = document.getElementById('modalname').innerHTML;
//- console.log('sfasfsdfsf',modalname);
//- return;
console.log('totoal width,height=',allWidth+','+allHeight);
var pos = 0;
for(let i=0;i&compinedImageCi++){
let index =
let rowcaId = 'vmCanvas_'+
let qrCompined = document.getElementById(rowcaId);
let imageName = qrCompined.getAttribute('name');
qrCompined.crossOrigin = 'anonymous';
let image = qrCompined.toDataURL();
//- let image = qrCompined.toBlob();
var fileName = imageName + '[' + i + ']' + '.png';
zipArc.addFileImage(fileName,image);
//- ctx.drawImage(qrCompined,0,pos,qrCompined.width ,qrCompined.height);
//- pos += qrCompined.height + maginB
isDrawEnd = true;
其他 js 代码:
js生成带有图片logo的二维码：
1：链接：http://blog.csdn.net/xuanzhangran/article/details/
自动生成二维码。
2：链接：http://blog.csdn.n...
图片合成，使用canvas，做一个漂亮的二维码分享
timg.jpgmycode.jpg&!DOCTYPE html&
发现一个生成二维码的小工具，可以设置背景图片
发现一个生成二维码的小工具visual-qr-code，java的，很不错的小工具
不是我做的，码云地址：https://gitee.com/boat/visual-qr-code...
不保存批量生成二维码并压缩zip下载
实现二维码的不保存下载,也就是现做现吃;因为可能是批量的,并进行zip压缩
二维码内置图片，并且把二维码放在图片指定位置上，画字，设置字本地样式，二维码批量生成
二话不说，直接上代码。
其中RegionsUtils.class.getClassLoader().getResourceAsStream(BACKGROUNDPIC) 是我本地的一个工具类，读取r...
public static void main(String[] args){
ChatServerImpl a=new ChatSer...
java程序把两张&em&图片合成&/em&在一起 立即下载
上传者: peichengya 时间:
综合评分: 4 积分/C币:3
Android一个利用ZXing生成带LOGO的&em&二维码图片&/em&Demo ...
1,本站注册的推广分销人员需要有自己的独有邀请码,这个邀请码需要转换成二维码,并让推广员保存在手机相册中,分发到其它群中,进行二维码图片推广
2,但是单独二维码过于简陋, 不够吸引眼球.需...
http://www.aazj.cn/pc/meeting/qrFreeTool.html
特点：二维码图片可以下载，中间带有Logo，在线裁切Logo。
技术特点：全部采用jquery框架开发，纯j...
没有更多推荐了，canvas实现二维码和图片合成的示例代码_html5教程技巧_脚本之家
canvas实现二维码和图片合成的示例代码发布时间： 15:21:52 作者：阿依吐拉
上个版本街道一个需求，使用url生成一个二维码，然后和另外一张图片合成一张图拍你，
实现思路是这样的
使用jr-qrcode将url生成data:base64供img使用
然后使用canvas 将两张图合成一张图片
遇到的问题
生成图片之后发现图片很模糊，解决办法是将canvas画布扩大两倍，其他参数也夸大两倍就可以了
jr-qrcode 可以使用npm install --save jr-qrcode 安装这个包
作用就是可以转化text到data:base64 供img的src 使用
import React, { Component } from 'react'
const qrcode = require('jr-qrcode')
const loadImg = (src) =& {
const paths = Array.isArray(src) ? src : [src];
const promise = [];
paths.forEach((path) =& {
promise.push(new Promise((resolve, reject) =& {
let img = new Image();
img.crossOrigin = &Anonymous&;
img.onload = () =& {
resolve(img);
img.onerror = (err) =& {
console.log('图片加载失败')
return Promise.all(promise);
const getImageData = (url, src) =& {
const imgsrc = qrcode.getQrBase64(url)
let canvas = document.createElement('canvas')
const width = document.documentElement.clientWidth
const height = document.documentElement.clientHeight
canvas.width = width*2
canvas.height = height*2
let ctx = canvas.getContext(&2d&)
loadImg([imgsrc, src]).then(([img1, img2]) =& {
ctx.drawImage(img2, 0, 0, width*2, height*2)
ctx.drawImage(img1, width-80, height*2-220, 200, 160)
ctx.fillStyle = 'rgba(0,0,0,0.3)';
ctx.fillRect(width-80, height*2-60, 200, 40);
ctx.save()
ctx.font=&28px Arial&
ctx.fillStyle = '#fff';
ctx.fillText('长按识别二维码', width-80, height*2-30, 200, 160)
let imageURL = canvas.toDataURL(&image/png&)
document.getElementById('mix_img').setAttribute('src',imageURL)
export default class QRcode extends Component {
render() {
const { url , picSrc} = this.props
getImageData(url,picSrc)
alt='mix_img' id='mix_img'/&
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。}