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 相关文章推荐
学习YUI.Ext 第三天
Mar 10 Javascript
通过$(this)使用jQuery包装后的方法或属性
May 18 Javascript
javascript实现控制浏览器全屏
Mar 30 Javascript
JavaScript知识点整理
Dec 09 Javascript
JSON对象转化为字符串详解
Aug 11 Javascript
JS闭包的几种常见形式实例详解
Sep 16 Javascript
使用Vue制作图片轮播组件思路详解
Mar 21 Javascript
JavaScript之实现一个简单的Vue示例
Jan 17 Javascript
JS+CSS3实现的简易钟表效果示例
Apr 13 Javascript
基于webpack4+vue-cli3项目实现换肤功能
Jul 17 Javascript
Javascript摸拟自由落体与上抛运动原理与实现方法详解
Apr 08 Javascript
angular共享依赖的解决方案分享
Oct 15 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
php用数组返回无限分类的列表数据的代码
2010/08/08 PHP
windows下安装php的memcache模块的方法
2015/04/07 PHP
PHP实现时间比较和时间差计算的方法示例
2017/07/24 PHP
通过js动态操作table(新增,删除相关列信息)
2012/05/23 Javascript
JavaScript执行顺序详细介绍
2013/12/04 Javascript
JS中Date日期函数中的参数使用介绍
2014/01/02 Javascript
JS二维数组的定义说明
2014/03/03 Javascript
JavaScript中停止执行setInterval和setTimeout事件的方法
2015/05/14 Javascript
jQuery实现简易的天天爱消除小游戏
2015/10/16 Javascript
AngularJS入门教程之Select(选择框)详解
2016/07/27 Javascript
js实现右键菜单功能
2016/11/28 Javascript
javascript事件的传播基础实例讲解(35)
2017/02/14 Javascript
vue通过路由实现页面刷新的方法
2018/01/25 Javascript
Vue监听一个数组id是否与另一个数组id相同的方法
2018/09/26 Javascript
vuejs2.0运用原生js实现简单拖拽元素功能
2020/08/21 Javascript
Vuex新手的理解与使用详解
2019/05/31 Javascript
微信小程序移动拖拽视图-movable-view实例详解
2019/08/17 Javascript
JS实现表单中点击小眼睛显示隐藏密码框中的密码
2020/04/13 Javascript
[54:08]LGD女子刀塔学院 DOTA2炼金术士教学
2014/01/09 DOTA
[00:48]完美“圣”典2016风云人物:xiao8宣传片
2016/11/30 DOTA
[46:55]完美世界DOTA2联赛决赛 FTD vs Phoenix 第三场 11.08
2020/11/11 DOTA
Python搭建HTTP服务器和FTP服务器
2017/03/09 Python
python提取具有某种特定字符串的行数据方法
2018/12/11 Python
python利用thrift服务读取hbase数据的方法
2018/12/27 Python
Python函数基础实例详解【函数嵌套,命名空间,函数对象,闭包函数等】
2019/03/30 Python
python切片(获取一个子列表(数组))详解
2019/08/09 Python
python分布式计算dispy的使用详解
2019/12/22 Python
Python web框架(django,flask)实现mysql数据库读写分离的示例
2020/11/18 Python
装潢设计专业推荐信模板
2013/11/26 职场文书
教师现实表现材料
2014/02/14 职场文书
寒山寺导游词
2015/02/03 职场文书
总经理岗位职责范本
2015/04/01 职场文书
校园音乐节目广播稿
2015/08/19 职场文书
2019如何书写演讲稿?
2019/07/01 职场文书
Java基于Dijkstra算法实现校园导游程序
2022/03/17 Java/Android
Windows server 2012 R2 安装IIS服务器
2022/04/29 Servers