毕业论文—使用js将canvas保存为图片文件,并且自定义文件名
该文章引用http://blog.csdn.net/qq547276542/article/details/51906741
1、从canvas中直接提取图片元数据
// 图片导出为 png 格式 var type = 'png' ; var imgData = canvas.toDataURL(type); |
上面的代码得到的数据格式为:data:image/png;base64,.....
2、将mime-type改为image/octet-stream,强制让浏览器直接download
/** * 获取mimeType * @param {String} type the old mime-type * @return the new mime-type */ var _fixType = function (type) { type = type.toLowerCase().replace(/jpg/i, 'jpeg' ); var r = type.match(/png|jpeg|bmp|gif/)[0]; return 'image/' + r; }; // 加工image data,替换mime type imgData = imgData.replace(_fixType(type), 'image/octet-stream' ); |
上面这个代码得到的数据格式为:data:image/octet-stream;base64,.....
3、图片download到本地
/** * 在本地进行文件保存 * @param {String} data 要保存到本地的图片数据 * @param {String} filename 文件名 */ var saveFile = function (data, filename){ var save_link = document.createElementNS( 'http://www.w3.org/1999/xhtml' , 'a' ); save_link.href = data; save_link.download = filename; var event = document.createEvent( 'MouseEvents' ); event.initMouseEvent( 'click' , true , false , window, 0, 0, 0, 0, 0, false , false , false , false , 0, null ); save_link.dispatchEvent(event); }; // 下载后的问题名 var filename = 'baidufe_' + ( new Date()).getTime() + '.' + type; // download saveFile(imgData,filename); |
毕业论文—使用js将canvas保存为图片文件,并且自定义文件名的更多相关文章
- js将canvas保存成图片并下载
<canvas id="canvas" width="400" height="400"></canvas> < ...
- js 将页面保存为图片
<!DOCTYPE html><html><head><title>保存为images</title><meta charset=&q ...
- Unity3D中调用外接摄像头,并保存为图片文件
http://bbs.9ria.com/thread-170539-1-1.html 项目要求调用摄像头,并且把图像保存下来,上传到服务器. 这里有几个难点,调用摄像头是很简单的,unity已经提供好 ...
- Canvas保存为图片
public static void GenerateCanvas(string imgSaveName, int canvasWidth, int canvasHeight, string imgD ...
- InputStream流保存成图片文件
public void saveBit(InputStream inStream) throws IOException{ ByteArrayOutputStream outStream = new ...
- ASP保存远程图片文件到本地代码
<% Function SaveRemoteFile(LocalFileName,RemoteFileUrl) SaveRemoteFile=True dim Ads,Retrieval,Get ...
- js 把字符串保存为txt文件,并下载到本地
代码如下 exportRaw('text.txt','123123123') function fakeClick(obj) { var ev = document.createEvent(" ...
- 基于html2canvas实现网页保存为图片及图片清晰度优化
一.实现HTML页面保存为图片 1.1 已知可行方案 现有已知能够实现网页保存为图片的方案包括: 方案1:将DOM改写为canvas,然后利用canvas的toDataURL方法实现将DOM输出为包含 ...
- 将HTML页面自动保存为PDF文件并上传的两种方式(一)-前端(react)方式
一.业务场景 公司的样本检测报告以React页面的形式生成,已调整为A4大小的样式并已实现分页,业务上需要将这个网页生成PDF文件,并上传到服务器,后续会将这个文件发送给客户(这里不考虑). 二.原来 ...
随机推荐
- 第一章 Part 2/2 Git 一览
被跟踪文件(Tracked files) 被跟踪文件是 Git 管理的工作目录 (存储库) 中的文件.当你添加新文件或使更新现有文件时,Git都会跟踪这些文件变化.在某个时间点,你将通过命令将这些文件 ...
- php、前端开发(网站建设)环境搭建
php集成开发环境wampserver,是一款免费开源的软件,下载地址http://www.wampserver.com,由于是国外的网站,打开速度慢,根据自己的电脑选择32位/64位的系统下载.
- js删除数组指定元素
删除js数组中制定的元素,这里用到了jquery. var a = new Array("a","b","cc","d3" ...
- Libero 使用拾忆
使用Libero软件进行管脚分配的时候可以使用脚本语言,详细的使用说明见des_constraints_ug.pdf(在Libero安装目录下寻找) 如: set_io srame_oe -REGIS ...
- html5 Websockets development guidance
1. WebSockets -- full-duplex communication The main HTML5 pillars include Markup, CSS3, and JavaScri ...
- Toad各版本所包含的组件
Toad for Oracle Base Edition Toad for Oracle Knowledge Xpert for PL/SQL Knowledge Xpert for Oracle A ...
- ObjC运行时部分概念解析(一)
转型iOS已经许久了,Runtime(运行时)还没有好好了解过.之前没有阅读过源码,紧紧凭借自己的臆测.现在阅读下源码,做一些笔记.方便再次翻阅 SEL SEL是一个关键字,如果没有涉及runtime ...
- my97中文乱码问题
在使用my97日期插件后页面显示中文乱码问题: 解决方法: 把下面这段代码复盖到你的ZH-CN.js就解决了 var $lang={ errAlertMsg: "\u4E0D\u5408\u ...
- linux 下安装mongodb
1.初始化docker: -v 设置docker和host共享目录,格式hostPath:dockerContainerPath -p 端口映射 --name,容器名称 cen ...
- ListView加载性能优化---ViewHolder---分页
ListView是Android中一个重要的组件,可以使用它加列表数据,用户可以自己定义列表数据,同时ListView的数据加载要借助Adapter,一般情况下要在Adapter类中重写getCoun ...