js实现canvas保存图片为png格式并下载到本地
canvas 保存图片
下载到本地
function base64Img2Blob(code){
var parts = code.split(';base64,');
var contentType = parts[0].split(':')[1];
var raw = window.atob(parts[1]);
var rawLength = raw.length; var uInt8Array = new Uint8Array(rawLength); for (var i = 0; i < rawLength; ++i) {
uInt8Array[i] = raw.charCodeAt(i);
} return new Blob([uInt8Array], {type: contentType});
}
function downloadFile(fileName, content){ var aLink = document.createElement('a');
var blob = base64Img2Blob(content); //new Blob([content]); var evt = document.createEvent("HTMLEvents");
evt.initEvent("click", false, false);//initEvent 不加后两个参数在FF下会报错
aLink.download = fileName;
aLink.href = URL.createObjectURL(blob); aLink.dispatchEvent(evt);
}
downloadFile('ship.png', canvas.toDataURL("image/png"));
js实现canvas保存图片为png格式并下载到本地的更多相关文章
- Node.js 使用http客户端得到网站的图片下载到本地
以下代码有些冗余,大家捡核心看就好. // 内置http模块,提供了http服务器和客户端功能 var http=require("http"); // cheerio模块,提供了 ...
- js+Canvas 利用js 实现浏览器保存图片到本地
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Particles.js基于Canvas画布创建粒子原子颗粒效果
文章目录 使用方法 自定义参数 相关链接 Particles.js是一款基于HTML5 Canvas画布的轻量级粒子动画插件,可以设置粒子的形状.旋转.分布.颜色等属性,还可以动态添加粒子,效果非常炫 ...
- 原生js实现canvas气泡冒泡效果
说明: 本文章主要分为ES5和ES6两个版本 ES5版本是早期版本,后面用ES6重写优化的,建议使用ES6版本. 1, 原生js实现canvas气泡冒泡效果的插件,api丰富,使用简单2, 只需引入J ...
- captcha.js一个生成验证码的插件,使用js和canvas生成
一.captcha`captcha.js`是一个生成验证码的插件,使用js和canvas生成的,确保后端服务被暴力攻击,简单判断人机以及系统的安全性,体积小,功能多,支持配置. 验证码插件内容,包含1 ...
- js中时间戳转换成时间格式
js中时间戳转换成时间格式, // 时间戳转换成时间格式 var formatDate = function(date){ date = new Date(date); var y=date.getF ...
- 【最简单的方法】js判断字符串是否为JSON格式(20180115更新)
前言 针对 “js判断字符串是否为JSON格式” 这个问题,在网上查了许多资料,都没找到自己想要的答案. 但是看到这个帖子<js判断字符串是否为JSON格式>后,突然灵光一闪,想到一种很简 ...
- js时间戳怎么转成日期格式
原文地址:http://www.sufeinet.com/thread-1500-1-1.html js时间戳怎么转成日期格式这个在主群里有朋友§☆釺哖蟲...o问js时间戳怎么转成日期格式 ,他的问 ...
- js将json数据以csv格式下载
摘要: 最近有一个非项目的小需求,就是将项目开发分工文件化,方便后期管理维护.但是开发时,分工安排都是以json格式记录的,所以就做了一个将json数据以csv格式下载到本地. 代码: <!DO ...
随机推荐
- day08 python文件操作
day08 python 一.文件操作 1.文件操作的函数 open(文件名, mode=模式, encoding=字符集) 2.模式: r, w, a, r+ ...
- ORM与JPA规范
一.ORM框架 1.ORM简单介绍 对象关系映射,(Object Relational Mapping,简称ORM),是通过使用描述对象和数据库之间的映射的元数据,将面向对象语言程序中的对象自动持久化 ...
- 洛谷P1935 [国家集训队]圈地计划
题目大意: 有个\(n*m\)的网格图 每个点可以选择\(A\),获得\(A[i][j]\)或选\(B\)获得\(B[i][j]\)的收益 相邻点有\(k\)个不同可以获得\(C[i][j]\)的收益 ...
- 【leetcode】954. Array of Doubled Pairs
题目如下: Given an array of integers A with even length, return true if and only if it is possible to re ...
- leetcode-163周赛-1260-二维网格迁移
题目描述: 自己的提交: class Solution: def shiftGrid(self, grid: List[List[int]], k: int) -> List[List[int] ...
- Boost Download
{ //https://www.boost.org/users/history/version_1_71_0.html }
- Android中对TextView中的部分内容的字体样式的设置方法
Android中的TextView中内容,有时候需要对其部分内容添加下划线和颜色操作: String str = "回复 " + uname + " 的评论: " ...
- RVIZ可视化平台
- js滚动到顶部底部代码
<!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>SCROLL</t ...
- switch type 类型判断
golang 语言中 也有 类是 javascript 的 typeof 判断类型的 方法 比如 func (a interface{}){ //第一种 if inst,ok:=a.(TypeA);o ...