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 相关文章推荐
javascript 学习之旅 (1)
Feb 05 Javascript
innerhtml用法 innertext用法 以及innerHTML与innertext的区别
Oct 26 Javascript
jquery二级导航内容均分的原理及实现
Aug 13 Javascript
JS扩展方法实例分析
Apr 15 Javascript
jQuery中$this和$(this)的区别介绍(一看就懂)
Jul 06 Javascript
老司机带你解读jQuery插件开发流程
May 16 Javascript
ES6新特性三: Generator(生成器)函数详解
Apr 21 Javascript
vue组件发布到npm简单步骤
Nov 30 Javascript
angular4 JavaScript内存溢出问题
Mar 06 Javascript
深入理解JavaScript和TypeScript中的class
Apr 22 Javascript
详解vue-loader在项目中是如何配置的
Jun 04 Javascript
JS非行间样式获取函数的实例代码
Jun 05 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 IF ELSE简化/三元一次式的使用
2011/08/22 PHP
php数组函数序列之asort() - 对数组的元素值进行升序排序,保持索引关系
2011/11/02 PHP
php新浪微博登录接口用法实例
2014/12/23 PHP
PHP实现多图上传(结合uploadify插件)思路分析
2016/11/30 PHP
PHP实现防止表单重复提交功能【基于token验证】
2018/05/24 PHP
当前流行的JavaScript代码风格指南
2014/09/10 Javascript
Nodejs学习笔记之测试驱动
2015/04/16 NodeJs
AngularJs表单验证实例代码解析
2016/11/29 Javascript
浅述Javascript的外部对象
2016/12/07 Javascript
基于vue.js轮播组件vue-awesome-swiper实现轮播图
2017/03/17 Javascript
微信小程序之电影影评小程序制作代码
2017/08/03 Javascript
详谈JS中数组的迭代方法和归并方法
2017/08/11 Javascript
浅谈JS函数节流防抖
2017/10/18 Javascript
JS实现十字坐标跟随鼠标效果
2017/12/25 Javascript
jQuery轮播图实例详解
2018/08/15 jQuery
javascript获取select值的方法完整实例
2019/06/20 Javascript
d3.js实现图形拖拽
2019/12/19 Javascript
js实现自动播放匀速轮播图
2020/02/06 Javascript
Postman如何实现参数化执行及断言处理
2020/07/28 Javascript
[01:15:56]2018DOTA2亚洲邀请赛3月30日 小组赛A组 TNC VS Newbee
2018/03/31 DOTA
[02:38]DOTA2 夜魇暗潮2020活动介绍官方视频
2020/11/04 DOTA
python实现数值积分的Simpson方法实例分析
2015/06/05 Python
python绘制条形图方法代码详解
2017/12/19 Python
Python3安装Pillow与PIL的方法
2019/04/03 Python
python 调试冷知识(小结)
2019/11/11 Python
详解纯CSS3制作的20种loading动效
2017/07/05 HTML / CSS
英国家用电器购物网站:Hughes
2018/02/23 全球购物
Ryderwear澳洲官网:澳大利亚高端健身训练装备品牌
2018/09/18 全球购物
迅雷Cued工作心得体会
2014/01/27 职场文书
水电维修专业推荐信
2014/09/06 职场文书
2014年中学生检讨书大全
2014/10/09 职场文书
2014年销售内勤工作总结
2014/12/01 职场文书
2015年医务科工作总结范文
2015/05/26 职场文书
党支部鉴定意见
2015/06/02 职场文书
谁动了我的奶酪读书笔记
2015/06/30 职场文书
教你怎么用python实现字符串转日期
2021/05/24 Python