精华内容
下载资源
问答
  • 2021-08-24 15:29:14

    这样的BUG比较小众,项目里面用到导出PDF的功能也不多,接触的人也不多。所以网上的资料也不多,整理出来以便给后来者一个参考,希望能帮到你!

    (关注一下博主,获取更多文章推送)

    BUG描述

    我主要是将包含有< pre>标签和< code>标签的HTML文章转换成PDF,而code标签里面放置的是java代码,代码如下:

    <pre>
    	<code>
    		public Object authentication(...){
    			// "/**"表示匹配所有
    			http.add().uriMatcher("/**");
    		}
    	</code>
    </pre>
    

    出现问题的就是上面的代码,当itextpdf解析到上面这段代码的时候,就中断了,后面的所有内容都没有导出。

    BUG解决

    经过反复对比,反复测试、反复失望,最后找到原因:
    1、主要是在导出过程中"/ * * “这个符号出现问题,不能有”/ * *"。我推测/ *可能是java代码中有比较特殊的含义,问题找到了,解决起来就很简单了。

    解决:将html代码中所有出现“*”(星号),全部替换成“※”(星号),就解决了问题。

    记录一下,希望对你有帮助!

    如果你的问题跟我不一样,那么你按照这个思路找找,可能有帮助!

    更多相关内容
  • html导出pdf 中文字体

    2021-09-30 09:23:27
    中文字体,导出中文转换
  • 里面包含html导出pdf的html2canvas.js和jspdf.debug.js两个文件
  • 3、动态html拼接转pdf public static void htmlCodeComeString(String linkcss,String htmlCode, String outputFile,String title) throws Exception { OutputStream os = new FileOutputStream(outputFile); ...
  • html2canvas,jspdf.debug俩个js文件,还有个小例子,例子有瑕疵,大概功能能实现,在优化吧,
  • HTML导出PDF代码.html

    2020-06-19 14:31:16
    一份可以将HTML页面导出成PDF的代码,亲测可以整肠生使用,在编辑好的HTML页面将本文件中的部分复制过去,即可进行将HTML页面导出PDF,在里面可以设置背景颜色,是否分页等属性。
  • HTML导出pdf的方式

    2021-12-07 10:40:03
    导出网页为PDF的方法

    前联通大佬江哥分享的导出网页为PDF的方法,可以根据Dom节点生成想要的pdf文件

    // 导出页面为PDF格式#
    import html2Canvas from 'html2canvas'
    import JsPDF from 'jspdf'
    export default{
      install (Vue, options) {
        Vue.prototype.getPdf = function (title) {
          html2Canvas(document.querySelector('#pdfDom'), {
            allowTaint: true
          }).then(function (canvas) {
              let contentWidth = canvas.width
              let contentHeight = canvas.height
              let pageHeight = contentWidth / 592.28 * 841.89
              let leftHeight = contentHeight
              let position = 0
              let imgWidth = 595.28
              let imgHeight = 592.28 / contentWidth * contentHeight
              let pageData = canvas.toDataURL('image/jpeg', 1.0)
              let PDF = new JsPDF('', 'pt', 'a4')
              if (leftHeight < pageHeight) {
                PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
              } else {
                while (leftHeight > 0) {
                  PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
                  leftHeight -= pageHeight
                  position -= 841.89
                  if (leftHeight > 0) {
                    PDF.addPage()
                  }
                }
              }
              PDF.save(title + '.pdf')
            }
          )
        }
      }
    }
    
    
    展开全文
  • html页面导出pdf

    2019-01-04 15:12:37
    将html页面导出pdf,将html页面导出pdf,利用 html2canvas + jsPDF 在线将HTML导出成pdf
  • php 实现 html 导出 PDF

    2021-03-23 17:53:45
    最近在做一个OA系统,客户要求把...考察过后,发现fpdf这个库不支持html导出pdf,不稳定,在 apache 环境下导出报错。我反馈问题给用fpdf做导出功能的小伙伴,他说他导出正常。最后我们对比了开发环境,他用的是 ngi...

    最近在做一个OA系统,客户要求把财务管理模块的几个单据的导出PDF格式。因为项目是团队开发,我最后才实现自己的任务里的导出PDF功能,看了前面小伙伴实现的导出PDF功能案例,他们使用的是 fpdf 这个库。

    考察过后,发现fpdf这个库不支持html导出pdf,不稳定,在 apache 环境下导出报错。我反馈问题给用fpdf做导出功能的小伙伴,他说他导出正常。最后我们对比了开发环境,他用的是 nginx ,我用的是 apache。这样的问题百度了一下没有答案,那就只能我自己去找问题的答案咯。经过不懈的努力,终于找到在 fpdf.php 这个文件下的 function Image 函数下一段代码:

    /*************************此段代码有bug******在apache下****************************

    if($w<0)

    $w = -$info['w']*72/$w/$this->k;

    if($h<0)

    $h = -$info['h']*72/$h/$this->k;

    **************************此段代码有bug***********************************/

    if($w<0) {

    $w = -(-$info['w'] * 72) / (-$w) / $this->k;

    }

    if($h<0) {

    $h = -(-$info['h'] * 72) / (-$h) / $this->k;

    }

    修复了一下,在 apache 下就可以正常导出了。

    最终因为fpdf不支持html导出PDF,我选用了 mpdf 这个库,很方便的就实现了 html 导出 pdf 的功能。

    $pdf = new Mpdf(['mode'=>'UTF-8']);

    $pdf->useAdobeCJK = true;

    $pdf->autoLangToFont = true;

    $pdf->autoScriptToLang = true;

    $fileContent = $this->fetch($this->templatePath.'pdf/travel_cost_apply');

    $pdf->AddPage();

    $pdf->WriteHTML($fileContent);

    $pdf->Output('差旅费用报销-'.$modelView['apply_user_name'].'-'.date('Y-m-d',$modelView['apply_time']).'.pdf','D');

    b103dc071e1609a8c9a43f455df52adf.png

    b3a0d696f22736f7b30f6e49c331c9ae.png

    a8d7b8f3274eafe1be1d9b03ac68063c.png

    83bbd06f89f63b2dddefdab497dc06c0.png

    如有疑问,欢迎加入QQ群:591528130(互联网项目帮) ,一起讨论交流学习。

    原创作者:动雪飞飞,QQ:282130106 。

    如有转载,敬请注明原创作者与出处,谢谢。

    展开全文
  • itext html导出pdf

    2018-07-09 16:31:38
    itext html导出pdf---------------------------------------------------------------------------------
  • Html解决pdf导出出现的中文数字等不换行等问题, 已重新修改了Jar包, 重新打包好了,可直接使用,亲测好用.
  • C# asp.net html 导出 pdf 打印 引用 wkhtmltopdf.exe,简单明了,不用编译那么多代码,直接调用wkhtmltopdf.exe把html格式的导出pdf ,经过本人测试时ok的!
  • html页面的内容导出pdf,带有demo的实例,通俗易懂,直接调用。
  • jsPdf文件,压缩包中有jspdf.debug.js和html2canvas.js文件,如果感觉麻烦,请到官网下载:https://parall.ax/products/jspdf,填写相关信息即可完成下载
  • 博文链接:https://294676001.iteye.com/blog/1622311
  • html导出pdf的四种方式

    千次阅读 2018-11-01 17:20:00
    html页面导出pdf文件并打印,可以直接在windows下使用Ctrl + P,苹果下⌘ + P。 如果需要用代码实现,可以考虑jsPDF、iText、wkhtmltopdf等方式。 以下是三种方式代码对比: 方式优点缺点分页图片表格...

    将html页面导出为pdf文件并打印,可以直接在windows下使用Ctrl + P,苹果下⌘ + P。

    如果需要用代码实现,可以考虑jsPDF、iText、wkhtmltopdf等方式。

    以下是三种方式代码对比:

    方式优点缺点分页图片表格链接中文特殊字符、样式导出样例备注
    jsPDF1、整个过程在客户端执行(不需要服务器参与),调用简单1、生成的pdf为图片形式,且内容失真支持支持支持不支持支持支持  
    iText1、功能基本可以实现,比较灵活2、生成pdf质量较高1、对html标签严;格,少一个结束标签就会报错;2、后端实现复杂,服务器需要安装字体;3、图片渲染比较复杂(暂时还没解决)支持支持支持支持支持支持  
    wkhtmltopdf1、调用方式简单(只需执行一行脚本);2、生成pdf质量较高1、服务器需要安装wkhtmltopdf环境;2、根据网址生成pdf,对于有权限控制的页面需要在拦截器进行处理支持支持支持支持支持支持  


    从实用和质量综合考虑,个人推荐使用iText。生成各种票据等文件质量好,代码也并不复杂。


    以下是我使用三种方式测试的例子,IDE使用IDEA,Spring Boot结合Freemarker。

    1.iText

    https://itextpdf.com/

    iText是一个第三方报表java插件,可以在后端利用java随意生成、转化pdf文件,提供了很多api,比较灵活。

            <!--PDF-->
            <dependency>
                <groupId>org.eclipse.birt.runtime.3_7_1</groupId>
                <artifactId>com.lowagie.text</artifactId>
                <version>2.1.7</version>
            </dependency>
            <dependency>
                <groupId>org.xhtmlrenderer</groupId>
                <artifactId>flying-saucer-pdf</artifactId>
                <version>9.0.8</version>
            </dependency>
            <dependency>
                <groupId>com.itextpdf</groupId>
                <artifactId>itextpdf</artifactId>
                <version>5.4.2</version>
            </dependency>
            <!--PDF end-->

    使用iText需要下载字体文件

      /**
         * iText生成PDF 需要字体支持
         *
         * @param args
         * @throws IOException
         * @throws DocumentException
         */
        public static void main(String[] args) throws IOException, DocumentException {
            ITextRenderer renderer = new ITextRenderer();
            ITextFontResolver fontResolver = renderer.getFontResolver();
            fontResolver.addFont("E:/下载/simsunttc/simsun.ttc", BaseFont.IDENTITY_H, BaseFont.NOT_EMBEDDED);
            OutputStream os = new FileOutputStream("E:/create/" + UUID.randomUUID() + ".pdf");
            String htmlstr = "<!DOCTYPE html>\n" +
                    "<html lang=\"en\">\n" +
                    "<head>\n" +
                    "    <title>Title</title>\n" +
                    "</head>\n" +
                    "<body>\n" +
                    "<table border=\"1\">\n" +
                    "    <tr>\n" +
                    "        <td>row 1, cell 1</td>\n" +
                    "        <td>row 1, cell 2</td>\n" +
                    "    </tr>\n" +
                    "    <tr>\n" +
                    "        <td>row 2, cell 1</td>\n" +
                    "        <td>row 2, cell 2</td>\n" +
                    "    </tr>\n" +
                    "</table>\n" +
                    "</body>\n" +
                    "</html>";
            renderer.setDocumentFromString(htmlstr);
            renderer.layout();
            renderer.createPDF(os);
        }

    使用Itext可以方便的根据写好的html模板来填充内容,设置标题页眉添加背景图片等操作。

    2.jsPDF

    生成效果并不是很好,但是无需后台服务器支持,操作简单

    <!DOCTYPE>
    <html>
      <head>
        <title>
          html2canvas example
        </title>
          <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <style type="text/css">
          body {
            margin: 0;
            padding: 0;
            background-color: white;
          }
          header, section {
              overflow: hidden;
          }
          ul {
            margin: 0;
            border: 0;
            padding: 0;
          }
          li {
            display: block; /* i.e., suppress marker */
            color: black;
            height: 4em;
            width: 25%;
            margin: 0;
            float: left;
            background-color: green;
            text-align: center;
            line-height: 4em;
          }
          
          aside {
            width: 20%;
            float: left;
            text-align: center;
          }
    
          aside a {
            display: block;
            height: 4em;
            color: blue;
          }
    
          article {
            padding: 2em 0;
            width: 80%;
            float: left;
          }
        </style>
      </head>
      <body>
        <header>
          <nav>
            <ul>
              <li>one</li>
              <li>two</li>
              <li>three</li>
              <li>four</li>
            </ul>
          </nav>
        </header>
        <section>
          <aside>
            <h3>it is a title</h3>
            <a href="">Stone Giant</a>
            <a href="">link2</a>
            <a href="">link3</a>
            <a href="">link4</a>
            <a href="">link5</a>
            <a href="">link6</a>
          </aside>
            <article>
                <img src="./img/Stone.png">
                <button id="renderPdf">DOWNLOAD PDF</button>
                <h2>Stone Giant</h2>
                <p>
                    Coming to life as a chunk of stone, Tiny's origins are a mystery on which he continually speculates. He is a Stone Giant now, but what did he used to be? A splinter broken from a Golem's heel? A shard swept from a gargoyle-sculptor's workshop? A fragment of the Oracular Visage of Garthos? A deep curiosity drives him, and he travels the world tirelessly seeking his origins, his parentage, his people. As he roams, he gathers weight and size; the forces that weather lesser rocks, instead cause Tiny to grow and ever grow.
                </p>
                <p>
                    以一团石头的形式出现的生命体,小小不断思索他的起源,但这始终是个谜。现在的他是个石巨人,但过去是什么呢?从土傀儡的脚后跟掉落的碎片?从制造石像鬼的工房被打扫出来的碎屑?神圣预言石的表层之砂?受到强烈的好奇心驱使,他不知疲倦的环游世界,寻找着他的起源,他的出身,和他的种族。在旅途中,他变得越来越庞大,不过路上的风雨吹打掉了他身上的石头,所以他不停的吸收新的岩石,永远在长大。
                </p>
                <img src="./img/Spectre.jpg">
                <h2>Spectre</h2>
                <p>
                    Just as higher states of energy seek a lower level, the Spectre known as Mercurial is a being of intense and violent energy who finds herself irresistibly drawn to scenes of strife as they unfold in the physical world. While her normal spectral state transcends sensory limitations, each time she takes on a physical manifestation, she is stricken by a loss of self--though not of purpose. In the clash of combat, her identity shatters and reconfigures, and she begins to regain awareness. She grasps that she is Mercurial the Spectre--and that all of her Haunts are but shadows of the one true Spectre. Focus comes in the struggle for survival; her true mind reasserts itself; until in the final moments of victory or defeat, she transcends matter and is restored once more to her eternal form.
                </p>
                <p>
                    和所有强大的能量都喜欢欺凌弱小一样,被称为墨丘利的幽鬼也是一个拥有着强横能量的存在,同样的,她对现实世界中的冲突和纷争无比着迷。然而她平时的幽鬼形态超越了常人的感知范围,因此每当她以实体形态出现时,她不得不损失一部分自我能量——尽管她也不愿意。在战斗中,她的自我意识逐渐散落并重新聚合,她也开始有了意识。她意识到了自己是幽鬼墨丘利——其他所有的鬼影都只是她自我的阴影。出于重新凝聚的打算,她开始专注,她的心智也在不断的成熟。只有等到她取得胜利或者彻底失败时,她那超物质的形态才会得以重聚。
                </p>
                <img src="./img/Ancient%20Apparition.jpg">
                <h2>Ancient Apparition</h2>
                <p>
                    Kaldr, the Ancient Apparition, is an image projected from outside time. He springs from the cold, infinite void that both predates the universe and awaits its end. Kaldr is, Kaldr was, Kaldr shall be...and what we perceive, powerful as it appears to us, is but the faintest faded echo of the true, eternal Kaldr. Some believe that as the cosmos ages and approaches its final moments, the brightness and power of Kaldr will also intensify--that the Ancient Apparition will grow younger and stronger as eternity's end draws nigh. His grip of ice will bring all matter to a stop, his image will cast a light too terrible to behold. An Apparition no longer!
                </p>
                <p>
                    卡德尔,极寒幽魂,是时光之外的冰冷投影。他来自寒冷的无尽虚空,目睹宇宙诞生,见证宇宙终结。卡德尔是夕在,今在,永在的无上力量...我们的所有认知,所有自认为正确的强大的事物,在永恒的卡德尔看来,不过是最细微最无力的附和。有人相信,随着宇宙的老化并走向衰亡,卡德尔的力量和光芒也将变得更强——极寒幽魂将更加年轻,更加强大。他对冰霜的控制能够冻结一切事物,他的投影放出的光芒异常夺目。他将不再是幽魂,而是神!
                </p>
                <img src="./img/weaver.jpg">
                <h2>Weaver</h2>
                <p>
                    The fabric of creation needs constant care, lest it grow tattered; for when it unravels, whole worlds come undone. It is the work of the Weavers to keep the fabric tight, to repair worn spots in the mesh of reality. They also defend from the things that gnaw and lay their eggs in frayed regions, whose young can quickly devour an entire universe if the Weavers let their attention lapse. Skitskurr was a master Weaver, charged with keep one small patch of creation tightly woven and unfaded. But the job was not enough to satisfy. It nagged him that the original work of creation all lay in the past; the Loom had done its work and travelled on. He wanted to create rather than merely maintain--to weave worlds of his own devising. He began making small changes to his domain, but the thrill of creation proved addictive, and his strokes became bolder, pulling against the pattern that the Loom had woven. The guardians came, with their scissors, and Weaver's world was pared off, snipped from the cosmic tapestry, which they rewove without him in it. Skitskurr found himself alone, apart from his kind, a state that would have been torment for any other Weaver. But Skitskurr rejoiced, for now he was free. Free to create for himself, to begin anew. The raw materials he needed to weave a new reality were all around him. All he had to do was tear apart this old world at the seams.
                </p>
                <p>
                    创世之纱需要长期细心的照料,以防止其变得残破;因为一旦它散开了,整个世界就将毁于一旦。编织者的工作就是保持创世之纱的紧密,用现实之网修补它的破损。他们同样要防止那些在创世之纱的缺口上产卵或者侵蚀创世之纱的虫子,只要编织者稍微分心,这些家伙的幼虫就能吞噬掉整个宇宙。斯吉茨格尔是一名大师级的编织者,负责维护一块小补丁的紧密。然而这项任务并不能满足他,他经常唠叨过去那些原始的创造工作,对干完活就走人的世界纺织者也是颇有微词。他想创造,不想只是维护——他想按自己的设计编织出自己的世界。他开始在他负责的区域上做手脚,逐渐不能自拔,他的胆子也愈发的大,甚至私自改动了世界纺织者编织的图案。最后,守卫者来了,毁掉了编织者所作的一切,直接从创世之纱上去除了这一块,然后重新编织,却不让他参与其中。斯吉茨格尔现在孤身一人,被种群所弃,换做任何其他编织者,都会备受折磨。然而斯吉茨格尔却无比愉悦,因为他终于自由了,能够自由的创造,重头开始。他创造新世界所需的所有材料都触手可及。他只需要从缺口处将现在的世界撕裂。
                </p>
                <img src="./img/Doom%20Bringer.jpg">
                <h2>Doom Bringer</h2>
                <p>
                    A towering being of unimaginable evil, Lucifer the Doom Bringer marches the farthest reaches of the world in search of new and exciting ways to satisfy his taste for unrest and greed. Once a feared leader in the army of the Purgers of the Realm, Doom left his position as a comrade of fellow demonic warriors as he simply could not bear the thought of sharing the glory of pillaging and feats of destruction with other lowly demons. Despite no longer leading an army, Doom is a fearful foe in combat, possessing mastery of hellish magic and physical attacks - eventually, the world will belong to Doom.
                </p>
                <p>
                    一个邪恶程度超乎想象的存在——末日使者路西法在世界各地不停寻找着新的方法来满足他的贪婪和对骚乱的热衷。他曾经是其所在国度中备受畏惧的灭劫军团统帅,然而末日使者后来却离开了他的将军职位,丢下了一帮恶魔战士,原因很简单,他无法与一帮低级恶魔分享掠夺和毁灭带来的所谓荣耀。尽管他不再是军队的统帅了,末日使者在战斗中仍然是个令人恐惧的对手,他拥有极高的肉搏技巧,还掌握了邪恶的地狱魔法——最终,整个世界将为他所有。
                </p>
                <img src="./img/Dragon%20Knight.jpg">
                <h2>Dragon Knight</h2>
                <p>
                    After years on the trail of a legendary Eldwurm, the Knight Davion found himself facing a disappointing foe: the dreaded Slyrak had grown ancient and frail, its wings tattered, its few remaining scales stricken with scale-rot, its fangs ground to nubs, and its fire-gouts no more threatening than a pack of wet matchsticks. Seeing no honor to be gained in dragon-murder, Knight Davion prepared to turn away and leave his old foe to die in peace. But a voice crept into his thoughts, and Slyrak gave a whispered plea that Davion might honor him with death in combat. Davion agreed, and found himself rewarded beyond expectation for his act of mercy: As he sank his blade in Slyrak's breast, the dragon pierced Davion's throat with a talon. As their blood mingled, Slyrak sent his power out along the Blood Route, sending all its strength and centuries of wisdom to the knight. The dragon's death sealed their bond and Dragon Knight was born. The ancient power slumbers in the Dragon Knight Davion, waking when he calls it. Or perhaps it is the Dragon that calls the Knight...
                </p>
                <p>
                    在传说中的龙冢——厄尔多姆试炼多年以后,骑士戴维安发现自己的对手愈发不能令他满意了:过去那个让人闻风丧胆的神龙斯莱瑞克已经变得苍老而脆弱,它的双翼已经残破,它所剩不多的龙鳞也开始腐烂,它的爪子变得肿大老化,它曾经引以为傲的火焰吐息现在威力和进水了的火柴差不多。戴维安觉得这样的屠龙行径已经不能给他带来任何荣誉,转身就要离开,让他的老对手安静的死去。但是他的脑海里传来了一个声音,斯莱瑞克低声的乞求着,让戴维安允许它光荣的战死。戴维安同意了,随即发现他的怜悯给他带来了意外的收获:当他将手中的锋刃刺入斯莱瑞克的胸膛时,龙使出最后的力量用龙爪刺穿了他的喉咙,随着他们血液的融合,斯莱瑞克将它所有的力量随着血液赐予了戴维安,也赐予了他龙族千万年来的智慧。龙的死去将他们的命运完全的绑定在了一起,龙骑士横空出世。古老的力量在龙骑士戴维安的身体里沉睡着,当他需要力量时则完全复苏。而龙族之力,也唤醒了骑士的所有力量...
                </p>
                <img src="./img/Venomancer.jpg">
                <h2>Venomancer</h2>
                <p>
                    In the Acid Jungles of Jidi Isle, poison runs in the veins and bubbles in the guts of every creature that scuttles, climbs or swoops between fluorescent vines dripping with caustic sap. Yet even in this toxic menagerie, Venomancer is acknowledged as the most venomous. Ages ago, an Herbalist named Lesale crossed the Bay of Fradj by coracle, searching for potent essences that might be extracted from bark and root, and found instead a nightmare transformation. Two leagues into Jidi's jungle, Lesale encountered a reptile camouflaged as an epiphyte, which stung him as he mistakenly plucked it. In desperation, he used his partial knowledge of the jungle's herbal bounty, mixing the venom of the (swiftly throttled) reptile with the nectar of an armored orchid, to compound an antidote. In the moments before a black paralysis claimed him completely, he injected himself by orchid-thorn, and instantly fell into a coma. Seventeen years later, something stirred in the spot where he had fallen, throwing off the years' accumulation of humus: Venomancer. Lesale the Herbalist no longer--but Lesale the Deathbringer. His mind was all but erased, and his flesh had been consumed and replaced by a new type of matter--one fusing the venom of the reptile with the poisonous integument of the orchid. Jidi's Acid Jungles knew a new master, one before whom even the most vicious predators soon learned to bow or burrow for their lives. The lurid isle proved too confining, and some human hunger deep in the heart of the Venomancer drove Lesale out in search of new poisons--and new deaths to bring.
                </p>
                <p>
                    在基迪岛上的浓酸密林中,在所有生物的体内,包括植物的根茎,动物的内脏中,都流淌着致命的腐蚀剧毒。然而,就算在这种毒巢里,剧毒术士也是公认的万毒之王。多年以前,一个叫做里瑟尔的植物学家乘坐小舟跨越弗拉基海湾,想要从植物的根须中提取出一种强力药剂,结果他却遭遇了噩梦一般的变故。在深入到基迪岛密林中数英里时,里瑟尔遇到了一种伪装成寄生植物的毒性爬虫,当他想把爬虫扯下来的时候,被爬虫狠狠的蛰了。绝望之际,他用他对丛林植物仅有的认知,飞快地掐住这只爬虫后,将它的毒液和一种带甲兰花的花蜜混合,合成了解毒剂。他用兰花的尖刺为自己注射了解毒剂,然后立即陷入昏迷,并且逐渐陷入了全身完全麻木的状态。十七年后,在他倒下的地方,从多年积累的腐土中钻出某个东西:剧毒术士。草药学家里瑟尔已经不复存在,现在他是死亡使者里瑟尔。他的记忆几乎都没有了,他原来的肉体已经毁灭,现在被一种新的物质所替代--融合了那只爬虫的毒液和兰花的毒性外皮。基迪岛的浓酸丛林现在有了新的主人,过去最剧毒的捕食者在他面前都只能逃走或臣服求饶。这个可怕的岛屿毕竟太有限了,里瑟尔受到内心深处残留的人类的饥渴驱使,离开了岛屿,去寻找新的毒物,以及带来新的死亡。
                </p>
                <img src="./img/Beast%20Master.jpg">
                <h2>Beast Master</h2>
                <p>
                    Karroch was born a child of the stocks. His mother died in childbirth; his father, a farrier for the Mad King of Slom, was trampled to death when he was five. Afterward Karroch was indentured to the king’s menagerie, where he grew up among all the beasts of the royal court: lions, apes, fell-deer, and things less known, things barely believed in. When the lad was seven, an explorer brought in a beast like none before seen. Dragged before the King in chains, the beast spoke, though its mouth moved not. Its words: a plea for freedom. The King only laughed and ordered the beast perform for his amusement; and when it refused, struck it with the Mad Scepter and ordered it dragged to the stocks. Over the coming months, the boy Karroch sneaked food and medicinal draughts to the wounded creature, but only managed to slow its deterioration. Wordlessly, the beast spoke to the boy, and over time their bond strengthened until the boy found he could hold up his end of a conversation--could in fact speak now to all the creatures of the King's menagerie. On the night the beast died, a rage came over the boy. He incited the animals of the court to rebel and threw open their cages to set them amok on the palace grounds. The Mad King was mauled in the mayhem. In the chaos, one regal stag bowed to the boy who had freed him; and with Beastmaster astride him, leapt the high walls of the estate, and escaped. Now a man, Karroch the Beastmaster has not lost his ability to converse with wild creatures. He has grown into a warrior at one with nature’s savagery.
                </p>
                <p>
                    卡洛克自出生伊始就被当做兽婴。他的母亲在他出生时就死去;他的父亲是狂王斯洛姆的马蹄铁匠,在他五岁时被马群践踏致死。后来,卡洛克将自己卖到国王的动物园干活,在那里,他和宫廷里面饲养的狮子,猩猩,野鹿以及其他一些很少见的甚至传说中的野兽一起长大。在他七岁那年,一个冒险者带着一只没人见过的野兽来觐见国王。当这只野兽被国王的链条锁住的时候,它说话了,乞求自由,然而它的嘴并没有张开。国王大笑,命令野兽表演助兴,遭到拒绝以后,国王用他的疯狂权杖狠狠的抽打了野兽,并把它关在了兽栏里面。接下来的几个月里,卡洛克每天都给这个受伤的野兽偷偷的带去食物和药物,然而这一切只能减缓野兽的死亡。这只野兽和卡洛克开始了交流,无言的交流,他们之间的情感纽带也随着时间的推移而加深,最后卡洛克发现他竟然能够和宫廷动物园里面的所有动物交流。在那只野兽死去的晚上,卡洛克狂怒无比,他煽动了所有的动物一起反叛,并且将它们的笼子打开,在宫廷广场上大开杀戒。狂王在动乱中受伤。在混乱之中,一只皇家雄鹿在这个救了它的男孩面前屈膝,让他以兽王的身份骑上它,带他跃过了堡垒的高墙,逃出生天。现在,兽王卡洛克已经成长为一个男子汉,并且仍然能够自由的和野生动物交谈。他已经成为了拥有自然狂猛野性的战士。
                </p>
                <img src="./img/Dark%20Seer.jpg">
                <h2>Dark Seer</h2>
                <p>
                    Fast when he needs to be, and a cunning strategist, Ish'Kafel the Dark Seer requires no edged weapons to vanquish his enemies, relying instead on the strength of his powerful mind. His talent lies in his ability to maneuver the fight to his advantage. Hailing from a place he calls 'The Land behind the wall,' Dark Seer remains an outsider here—a warrior from a realm beyond the veil of this reality. Once a great general among his people, and a valiant defender of the god-king Damathryx, Dark Seer’s army was wiped out by a much larger force in the final days of the Great Boundaries War. Facing certain defeat, he made one last desperate act: he led the enemy forces into the maze between the walls. At the last moment, just before capture, he crossed over—then sealed the walls forever in an explosive release of dark energy. When the dust settled, he saw that he had saved his people but found himself blinking at the sun of a different world, with no way to return. Now he is committed to proving his worth as a military strategist, and vows to show that he’s the greatest tactician this strange new world has ever seen.
                </p>
                <p>
                    迅捷如风,足智多谋,黑暗贤者依什卡菲尔并不需要多么锋利的武器来搏斗,他总是运用强大的心灵之力来征服敌人。他有着颠覆战局使之对己方有利的天才。迎着欢呼和敬意,他从一个叫做“幻墙之末”的世界走了出来,并不热衷于这个世界的纷争——他是一个来自现实世界之外的勇者。曾经,黑暗贤者是备受人民尊敬的将军,是神王达玛瑞克斯麾下英勇的保卫者,然而他的军队在边境大战的最后几天,被一股更为强大的力量悉数歼灭。面临如此惨败,他绝望的做出了最后一个决定:引诱着敌军进入了幻墙迷宫。在他即将被捕的前一刻,他穿过幻墙,释放出强大的黑暗能量,将幻墙永远的封印起来。当飞扬的尘土归于平静以后,他发现他成功的拯救了自己的人民,而自己却沐浴在另一个世界的阳光下,亦真亦幻,无法回到现实世界。现在,他决心以一名战略家的身份来证明自己的价值,并且立誓要让这个新的世界见识他那伟大的谋略。
                </p>
            </article>
        </section>
        <footer>write by linwalker @2017</footer>
        <script type="text/javascript" src="./js/html2canvas.js"></script>
        <script type="text/javascript" src="./js/jsPdf.debug.js"></script>
        <script type="text/javascript">
    
          var downPdf = document.getElementById("renderPdf");
    
          downPdf.onclick = function() {
              html2canvas(document.body, {
                  onrendered:function(canvas) {
    
                      var contentWidth = canvas.width;
                      var contentHeight = canvas.height;
    
                      //一页pdf显示html页面生成的canvas高度;
                      var pageHeight = contentWidth / 595.28 * 841.89;
                      //未生成pdf的html页面高度
                      var leftHeight = contentHeight;
                      //pdf页面偏移
                      var position = 0;
                      //a4纸的尺寸[595.28,841.89],html页面生成的canvas在pdf中图片的宽高
                      var imgWidth = 555.28;
                      var imgHeight = 555.28/contentWidth * contentHeight;
    
                      var pageData = canvas.toDataURL('image/jpeg', 1.0);
    
                      var pdf = new jsPDF('', 'pt', 'a4');
                      //有两个高度需要区分,一个是html页面的实际高度,和生成pdf的页面高度(841.89)
                      //当内容未超过pdf一页显示的范围,无需分页
                      if (leftHeight < pageHeight) {
                          pdf.addImage(pageData, 'JPEG', 20, 0, imgWidth, imgHeight );
                      } else {
                          while(leftHeight > 0) {
                              pdf.addImage(pageData, 'JPEG', 20, position, imgWidth, imgHeight)
                              leftHeight -= pageHeight;
                              position -= 841.89;
                              //避免添加空白页
                              if(leftHeight > 0) {
                                  pdf.addPage();
                              }
                          }
                      }
    
                      pdf.save('content.pdf');
                  }
              })
          }
        </script>
      </body>
    </html>

    3.wkhtmltopdf

    wkhtmltopdf是一个可以把html转为pdf的插件,有windows、linux等平台的版本,最大的特点就是使用简单,语言无关性。
    1、下载:官网下载 https://wkhtmltopdf.org/downloads.html
    2、执行:该插件是“绿色版”,无需编译安装,下载解压后,在bin目录下有wkhtmltoimage和wkhtmltopdf两个文件,生成pdf可以直接运行wkhtmltopdf(也可以把bin目录配置到环境变量),执行wkhtmltopdf -V查看是否可以执行。 

    wkhtmltopdf --disable-smart-shrinking https://www.cnblogs.com/jiangwz myBlog.pdf

    生成的PDF文件:

     

    转载于:https://www.cnblogs.com/jiangwz/p/9890472.html

    展开全文
  • 1、解决HTMLpdf 中文、数字、英文不能换行的问题,修改的源码包 重新计算了右边距。 2、htmlpdf 参考我的另外一篇博文https://blog.csdn.net/qq_38616723/article/details/125188407?spm=1001.2014.3001.5502
  • 网页导出PDF插件(html2canvas 和 jsPDF)网页导出PDF插件(html2canvas 和 jsPDF)网页导出PDF插件(html2canvas 和 jsPDF)网页导出PDF插件(html2canvas 和 jsPDF)
  • swagger导出pdfhtml

    2018-11-14 16:23:33
    swagger导出pdfhtml
  • 主要介绍了phantomjs导出htmlpdf的方法总结,需要的朋友可以参考下
  • 您可以将子页面导出HTML,然后使用此工具将其转换为 PDF。 下载 从发布页面获取适用于 Windows 和 Mac 的最新下载: 用法 下载工具并解压。 在,将您希望导出的所有页面放在一个页面中,然后单击“导出”,...
  • html导出PDF 最近做了个知识管理功能,其中有个需求是将文档导出为pdf,所以就前端实现了一下。但由于前端导出的全部是图片,文字无法复制,最终由后端实现导出。 github地址:...
  • 使用Easy POI的API实现POI对Excel的所有操作,并且它的封装类可以让你快速上手,无需编写大量的Excel格式设置等复杂代码,高效,完善,高并发
  • pdf-html:将dom导出pdf

    2021-05-12 17:05:29
    将任意单个或多个dom元素导出pdf install npm i -S pdf-html usage 导出单个元素 import pdfHtml from 'pdf-html'; pdfHtml({ el: document.body }); // 使用选择器,(匹配到该选择器的元素都将出现在pdf中) ...
  • 前端实现HTMLPDF下载
  • 重点注意:导出HTML须要在导出的HTML中对中文文本直接指定font-faimly,否者HTML导出pdf仍会中文乱码 html转pdf代码 若是以上测试代码经过了,就能够编写正式的导出代码。 html方法定义: html(HTMLelement|...
  • 包含 itext-asian-5.2.0.jar itextpdf-5.5.5.jar
  • 基础效果图: demo源码 使用html2canvas自动分页效果图: demo源码 一、基础: 1.先引入几个文件 ...script src="https://cdn.bootcdn.net/ajax/libs/html2canvas/0.5.0-beta4/html2canvas.min.js"&g
  • 如果是简单的页面快照,不没有太多的渲染,可以用html2canvas.min.js导出图片或者html2pdf.bundle.min.js导出pdf,仅仅在前端就可以完成。但是复杂的页面,以上的导出效果不好,质量也不高。因此我采用PhantomJS,...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 35,050
精华内容 14,020
关键字:

html导出pdf

友情链接: magnify unmodified.zip