zoukankan      html  css  js  c++  java
  • Javascript的一个生产PDF的库: unicode和中文问题的解决

    Javascript的一个生产PDF的库: unicode和中文问题的解决
    基于canvas和jspdf库, 实现用javascript的支持中文pdf生成实用工具.
    参考:
    http://javascript.ruanyifeng.com/htmlapi/canvas.html


    1. 使用canvas将中文写入canvas中,再将canvas转换成图片,从而解决中文问题。

    <!DOCTYPE html>
    <html>
    <head>
    </head>
    <body>
    
    <canvas id="myCanvas" width="200" height="200">
    </canvas>
    
    <div id="myDiv">
    </div>
    
    <script type="text/javascript">
    var canvas = document.getElementById("myCanvas");
    if (canvas.getContext) {
    var ctx = canvas.getContext("2d");
    // 设置字体
    ctx.font = "Bold 20px Arial";
    // 设置对齐方式
    ctx.textAlign = "left";
    // 设置填充颜色
    ctx.fillStyle = "#008600";
    // 设置字体内容,以及在画布上的位置
    ctx.fillText("好啊!", 10, 50);
    // 绘制空心字
    ctx.strokeText("好的啊!", 10, 100);
    
    // save to png
    var image = new Image();
    image.src = canvas.toDataURL("image/png");
    
    // create 'img' element in memory
    var nodeImage = document.createElement("img");
    nodeImage.src = image.src;
    
    // append element to html
    var nodeDiv = document.getElementById("myDiv");
    nodeDiv.appendChild(nodeImage);
    
    };
    
    </script>
    </body>
    
    </html>

    2. 使用jspdf 的图片嵌入功能, 将中文图片嵌入到pdf中, 实现前端生成中文pdf.

    http://parall.ax/products/jspdf

  • 相关阅读:
    基于flv.js自定义播放器UI界面
    使用node.js将xmind导出的excel转换为json树
    开启Hyper-V
    vue刷新当前路由
    react native练习
    mock js使用方法简单记录
    前端小技巧总结
    常用js函数开始收集~
    文字跳动
    cordova 修改状态栏的颜色,修改顶部电池字体颜色
  • 原文地址:https://www.cnblogs.com/ToDoToTry/p/4590791.html
Copyright © 2011-2022 走看看