createImg(store, data) {
let timer = setTimeout(function (params) {
let _canvas = document.querySelector(".setPictureSection");
var w = parseInt(window.getComputedStyle(_canvas).width);
var h = parseInt(window.getComputedStyle(_canvas).height);
//将canvas画布放大若干倍,然后盛放在较小的容器内,就显得不模糊了
var canvas2 = document.createElement("canvas");
var scale = 2; canvas2.width = w * 2;
canvas2.height = h * 2;
canvas2.style.width = w + "px";
canvas2.style.height = h + "px";
canvas2.getContext("2d").scale(scale, scale); html2canvas(document.querySelector(".setPictureSection"), {
// allowTaint: true,
// taintTest: false,
scale: 1,
dpi: window.devicePixelRatio * 5,
// canvas: canvas2,
userCORS: true,
backgroundColor: '#ffffff',
width: w,
height: h,
x: 0,
y: 0,
}).then(function (canvas) {
//document.body.appendChild(canvas);
//canvas转换成url,然后利用a标签的download属性,直接下载,绕过上传服务器再下载
document.querySelector(".down")
.setAttribute("href", canvas.toDataURL("image/png", 1.0));
$(".down")[0].click(); });
timer = null;
}, 350)
},

  

h5 图片生成的更多相关文章

  1. H5图片裁剪升级版

    前段时间做了个跟裁剪相关的活动<用H5中的Canvas等技术制作海报>,这次公司要做个与奥运相关的活动,扫车牌赢奖. 于是我就在上一个活动的基础上,将代码重新封装一下,并且将计算方式写的更 ...

  2. h5自动生成工具

    一.前言 写了很多h5之后,对于写手写html和css已经麻木的我决定动手写个工具自动生成h5结构和样式.其实这个想法由来已久,但总是觉得自己技术不够,所以一直没实行.直到某天我真的写够了,我决定动手 ...

  3. H5图片裁剪升级版(手机版)

    前段时间做了个跟裁剪相关的活动<用H5中的Canvas等技术制作海报>,这次公司要做个与奥运相关的活动,扫车牌赢奖. 于是我就在上一个活动的基础上,将代码重新封装一下,并且将计算方式写的更 ...

  4. H5 图片上传

    1.h5 图片异步上传 (1) 异步上传input触发onchange事件的时候,就把图片上传至服务器.后台可能会返回图片的链接等信息,前台可以把图片信息展示给用户看. (2) 另一种情况可能需要前台 ...

  5. thinkphp3.2与phpexcel带图片生成 完美案例

    thinkphp3.2与phpexcel完美案例 // 导出exl public function look_down(){ $id = I('get.id'); $m = M ('offer_goo ...

  6. phpcms v9图片生成缩略图变成黑色解决方法

    今天客户反映,上传的图片生成缩略图有的图片变成黑色,出现问题就百度了一下,有不少网友也遇到这样的问题,但是官方论坛也没有给出解决办法,那还得靠自己解决了,于是就研究phpcms v9 图片压缩代码.打 ...

  7. 验证码图片生成工具类——Captcha.java

    验证码图片生成工具,使用JAVA生成的图片验证码,调用getRandcode方法获取图片验证码,以流的方式传输到前端页面. 源码如下:(点击下载  Captcha.java) import java. ...

  8. CSS3鼠标移入移出图片生成随机动画

    今天分享使用html+css3+少量jquery实现鼠标移入移出图片生成随机动画,我们先看最终效果图(截图为静态效果,做出来可是动态的哟) 左右旋转 上下移动 缩放 由于时间关系我就不一步步解析各段代 ...

  9. Android长方形图片生成正圆形,以及矩形图片生成圆角

    一般要做正圆形图片,只能是正方形的基础上才能实现,否则就变成椭圆了,下面说说如何使长方形的图片生成正圆形图片 废话不多说,没图没真相,先上图吧: 原图:  变成正圆后:  下面上代码: public ...

随机推荐

  1. MySQL binlog 企业案例升级版

    需求:1.创建一个数据库 oldboy2.在oldboy下创建一张表t13.插入5行任意数据4.全备5.插入两行数据,任意修改3行数据,删除1行数据6.删除所有数据7.再t1中又插入5行新数据,修改3 ...

  2. hadoop集群部署

    1) 安装jdk 下载jdk-6u21-linux-i586.bin 然后修改/etc/profile: export JAVA_HOME=/usr/local/jdk export CLASSPAT ...

  3. 1125 Chain the Ropes (25 分)

    1125 Chain the Ropes (25 分) Given some segments of rope, you are supposed to chain them into one rop ...

  4. 关于postman中表单提交与数据包提交的问题,file_get_contents("php://input")可以获取数据,$_POST不能获取数据

    Coentent-Type仅在取值为application/x-www-data-urlencoded和multipart/form-data两种情况下,PHP才会将http请求数据包中相应的数据填入 ...

  5. C#对windows的IP网络测试(ping ip)

    private string CmdPing(string strIp) { Process p = new Process(); //设定程序名 p.StartInfo.FileName = &qu ...

  6. KafkaAPI实战

    新旧API使用 Flume和Kafka集成: Kafka有两套API: 过时的API 和新API 准备工作 <dependencies> <dependency> <gr ...

  7. windows下使用gethostbyname函数报错无法解析的外部符号

    #include <winsock.h> 使用gethostbyname的函数的时候,会显示无法解析的外部符号. 主要问题是因为没有引用WS2_32的lib库 在include上面引用就行 ...

  8. Python ————反射机制

    python中的反射功能是由以下四个内置函数提供:hasattr.getattr.setattr.delattr,改四个函数分别用于对对象内部执行:检查是否含有某成员.获取成员.设置成员.删除成员. ...

  9. Jquery ajax 参数 详解

    Jquery ajax 参数主要如下: url: 要求为String类型的参数,(默认为当前页地址)发送请求的地址. type: 要求为String类型的参数,请求方式(post或get)默认为get ...

  10. web api 本地测试

    [最简单的,本人小白,大神勿喷] 一:创建web API 服务端 ①创建web api 的项目 ②在这个api项目的Web.config中加上如下几段话: <httpProtocol>&l ...