-

HTML转图片的JS插件-rasterizeHTML.js

WEB前端

WEB前端工作中,有时需要实现对页面生成缩略图的功能。rasterizeHTML.js就可以将HTML渲染到浏览器的canvas中,直接用JS插件达到生成图片的效果。rasterizeHTML.js为我们提供了三个方法:rasterizeHTML.drawURL( url [, canvas] [, options] )根据URL生成canvas,rasterizeHTML.drawHTML( html [, canvas] [, options] )根据HTML代码生成,rasterizeHTML.drawDocument( document [, canvas] [, options] )根据文档生成。下面雷雪松详细的介绍一下HTML转图片的JS插件-rasterizeHTML.js。

1、引入rasterizeHTML.js。
[cc lang=”javascript” escaped=”true”]<script type=”text/javascript” src=”rasterizeHTML.allinone.js”></script>[/cc]

2、创建一个canvas,rasterizeHTML.js生成图片。
[cc lang=”javascript” escaped=”true”]var canvas = document.getElementById(“canvas”);
rasterizeHTML.drawHTML(‘Some ‘ + ‘<span style=”color: green; font-size: 20px;”>HTML</span>’ + ‘ with an image’, canvas);[/cc]
注意:drawURL()加载的URL必须是同域名URL或者是支持跨域的URL。

来源:HTML转图片的JS插件-rasterizeHTML.js

10 评论 “HTML转图片的JS插件-rasterizeHTML.js

    新闻头条 评论:
    2017年11月8日 下午2:10

    文章不错支持一下吧

    福利老幺 评论:
    2017年11月12日 下午9:56

    这个功能,好像可以不用JS来实现吗?

    个人博客 评论:
    2017年11月15日 下午11:12

    感谢分享

    花记App 评论:
    2017年11月20日 下午3:20

    无意间发现你的博客,挺棒的,关注啦

    新闻头条 评论:
    2017年11月20日 下午3:52

    文章不错非常喜欢

    我来也 评论:
    2018年1月23日 下午3:48

    来了来了

    丁合超的博客 评论:
    2019年2月18日 下午2:30

    好东西,不错

    网赚项目 评论:
    2019年4月12日 上午9:43

    支持一下

    东方小说阅读网 评论:
    2019年5月10日 下午10:33

    非常精彩的文章,引人入胜,痛快淋漓。感谢楼主分享。

    电子商务自考 评论:
    2021年7月25日 下午2:49

    好东西谢谢分享

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注