jsPDF生成pdf后在网页展示实例


Posted in Javascript onJanuary 16, 2014
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=GBK"> 
<title>jsPDF</title> 
<script type="text/javascript" src="jspdf.js"></script> 
<script type="text/javascript"> 
window.onload=function(){ 
var doc = new jsPDF(); 
//var doc = new jsPDF('landscape');//横排 doc.setProperties({//设置文档属性 
title: 'Title', 
subject: 'This is the subject', 
author: 'Dragon', 
keywords: 'javascript, web 2.0, ajax', 
creator: 'MEEE' 
}); 
doc.setTextColor(0,255,0); 
doc.setFontSize(22); 
doc.setFont("times"); 
doc.setFontType("italic"); 
doc.text(20, 20, 'Hello world!');//添加文字 
doc.setTextColor(255,0,0); 
doc.setFontSize(16); 
doc.setFont("helvetica"); 
doc.setFontType("bold"); 
doc.text(20, 30, 'This is client-side Javascript, pumping out a PDF.'); 
doc.addPage();//添加页 
doc.setLineWidth(1);//设置线宽 
doc.setDrawColor(0,255,0);//设置画笔颜色 
doc.setFillColor(255,0,0);//设置填充颜色 
doc.line(60, 20, 115, 60);//画线,两个坐标 
doc.rect(100, 50, 20, 30); //画矩形,左上角坐标,宽度,高度,只有边框 
doc.ellipse(20, 20, 20, 10, 'F');//画椭圆,中心点坐标,宽度,高度,只有边 
doc.circle(120, 20, 20, 'FD');//画圆,中心点坐标,半径,边框和填充都有 
doc.triangle(100, 100, 110, 100, 120, 130, 'FD'); 
//doc.output('datauri');//直接输出为新的web页 
document.getElementById("iframe123").src = doc.output('datauristring');//在iframe中显示 
} 
</script> 
</head> 
<body> 
<iframe id="iframe123" frameborder="0" width="400" height="500"></iframe> 
</body> 
</html>
Javascript 相关文章推荐
JSQL  一个 web DB 的封装
May 05 Javascript
jquery autocomplete自动完成插件的的使用方法
Aug 07 Javascript
超漂亮的jQuery图片轮播特效
Nov 24 Javascript
vue如何使用 Slot 分发内容实例详解
Sep 05 Javascript
Angular4绑定html内容出现警告的处理方法
Nov 03 Javascript
webpack构建换肤功能的思路详解
Nov 27 Javascript
Vue下的国际化处理方法
Dec 18 Javascript
Vue2.0 事件的广播与接收(观察者模式)
Mar 14 Javascript
js统计页面上每个标签的数量实例代码
May 29 Javascript
JS在Array数组中按指定位置删除或添加元素对象方法示例
Nov 19 Javascript
ES5 模拟 ES6 的 Symbol 实现私有成员功能示例
May 06 Javascript
js实现mp3录音通过websocket实时传送+简易波形图效果
Jun 12 Javascript
在firefox和Chrome下关闭浏览器窗口无效的解决方法
Jan 16 #Javascript
js获取某元素的class里面的css属性值代码
Jan 16 #Javascript
JS可以控制样式的名称写法一览
Jan 16 #Javascript
js仿百度贴吧验证码特效实例代码
Jan 16 #Javascript
js中传递特殊字符(+,&amp;)的方法
Jan 16 #Javascript
利用浏览器全屏api实现js全屏
Jan 16 #Javascript
JQuery文本改变触发事件如聚焦事件、失焦事件
Jan 15 #Javascript
You might like
joomla内置的表单验证功能使用方法
2010/06/11 PHP
深入eAccelerator与memcached的区别详解
2013/06/06 PHP
CodeIgniter安全相关设置汇总
2014/07/03 PHP
php隐藏实际地址的文件下载方法
2015/04/18 PHP
php处理复杂xml数据示例
2016/07/11 PHP
浅谈PHP各环境下的伪静态配置
2019/03/13 PHP
js动画(animate)简单引擎代码示例
2012/12/04 Javascript
点击标签切换和自动切换DIV选项卡
2014/08/10 Javascript
Javascript无参数和有参数类继承问题解决方法
2015/03/02 Javascript
DWR中各种java方法的调用
2016/05/04 Javascript
浅谈js对象的创建和对6种继承模式的理解和遐想
2016/10/16 Javascript
JavaScript遍历Json串浏览器输出的结果不统一问题
2016/11/03 Javascript
带你快速理解javascript中的事件模型
2017/08/14 Javascript
vue如何安装使用Quill富文本编辑器
2018/09/21 Javascript
Vue + Element UI图片上传控件使用详解
2019/08/20 Javascript
js实现点击生成随机div
2020/01/16 Javascript
Django的分页器实例(paginator)
2017/12/01 Python
pandas创建新Dataframe并添加多行的实例
2018/04/08 Python
Python线程池模块ThreadPoolExecutor用法分析
2018/12/28 Python
解决pycharm 工具栏Tool中找不到Run manager.py Task的问题
2019/07/01 Python
python使用writerows写csv文件产生多余空行的处理方法
2019/08/01 Python
python中open函数的基本用法示例
2019/09/07 Python
基于python实现学生信息管理系统
2019/11/22 Python
kafka-python 获取topic lag值方式
2019/12/23 Python
python numpy数组复制使用实例解析
2020/01/10 Python
Python用K-means聚类算法进行客户分群的实现
2020/08/23 Python
html5 音乐播放器 audio 标签使用概述
2013/07/15 HTML / CSS
详解HTML5 window.postMessage与跨域
2017/05/11 HTML / CSS
牵手50新加坡:专为黄金岁月的单身人士而设的交友网站
2020/08/16 全球购物
命名空间(namespace)和程序集(Assembly)有什么区别
2015/09/25 面试题
毕业生求职信范文
2014/06/29 职场文书
领导班子四风问题对照检查材料
2014/09/27 职场文书
区长工作作风个人整改措施
2014/10/01 职场文书
运动会宣传语
2015/07/13 职场文书
详细谈谈MYSQL中的COLLATE是什么
2021/06/11 MySQL
Nginx 匹配方式
2022/05/15 Servers