【问题标题】:How to create image or pdf from html having css filters?如何从具有 css 过滤器的 html 创建图像或 pdf?
【发布时间】:2017-04-01 05:07:16
【问题描述】:

我想从 html 创建图像或 pdf。该 html 由带有 css 过滤器(如棕褐色、灰度等)的图像组成。所以如果有人研究过它会更好。

<img class="dj_rot" src="/940/images/photos.png" style="filter: sepia(1);">
<img class="dj_rot" src="/940/images/photos.png" style="filter: grayscale(1);">

谢谢 迪帕克

【问题讨论】:

    标签: javascript php css pdf-generation


    【解决方案1】:

    您可以使用“html2canvas”是一个开源脚本,允许您对网页或其部分进行“截图”

    https://html2canvas.hertzen.com/

    你会看到很多例子说明如何在同一个网页中使用

    如果您想创建 PDF,您可以使用 jsPDF 是基于 Javascript 的另一种选择

    http://rawgit.com/MrRio/jsPDF/master/

    您还可以找到包含示例和源代码的文档

    如果还不够,你可以使用允许这样做的 API,你只需要建立一个 URL,然后你就会收到图像

    https://screenshotlayer.com/
    

    Screenshotlayer(免费、强大的 Screenshot API) url2png(截图即服务) urlbox.io(网站截图即服务 API urlbox) screenshotmachine(截图机) Browshot(网站实时截图服务)

    您可以查看包含更多信息的链接 最好的网站截图捕获 API 是什么?

    https://www.quora.com/Whats-the-best-website-screenshot-capture-API
    

    【讨论】:

    • 感谢您的帮助 Luis,是的,这些是开源的,但它们都没有在输出中提供 css 过滤器。我尝试过 html2canvas、jspdf 和 mpdf。结果是一样的。如果我尝试使用图像创建画布并添加过滤器,那么它会在控制台上显示已应用 css 但不在屏幕或 pdf 中。
    • 对,大多数情况下的问题是样式没有正确渲染,你可以尝试使用API​​来生成相同的PDF,我将在上面写一些跨度>
    • 可以使用截图层,但它是付费的,不是开源的。
    【解决方案2】:

    您是否尝试过截取 HTML 的屏幕截图?要截屏,您应该按 command+shift+4。数字 3 截取整个屏幕,而数字 4 允许您选择要截取的内容。

    【讨论】:

    • 感谢您的回复珍妮弗。对不起,我没有告诉技术。实际上,我希望在我的编程中使用 js 或 php 语言来实现这个功能。
    • 哦,对不起。我对你为什么不使用简单的屏幕截图感到困惑。
    【解决方案3】:

    您可能想使用 pdf 转换工具,例如 html2pdf 或 mPDF for PHP。 我过去成功使用过 html2pdf,但我很确定它们都对 CSS 有很好的支持。

    【讨论】:

    猜你喜欢
    • 2012-06-08
    • 1970-01-01
    • 2016-05-02
    • 2013-07-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-05-28
    相关资源
    最近更新 更多