html-to-image 将 DOM 节点转换成图像的工具

开源地址
https://github.com/bubkoo/html-to-image授权协议
MIT

html-to-image是一个使用HTML5cavas和SVG从DOM节点生成图像的工具。

安装pmistall--savehtml-to-image用法/*ES6*/import*ashtmlToImagefrom'html-to-image';import{toPg,toJpeg,toBlob,toPixelData,toSvg}from'html-to-image';/*ES5*/varhtmlToImage=require('html-to-image');所有顶级函数都接受DOM节点和渲染选项，并返回一个由相应dataURL实现的承诺：

toPgtoSvgtoJpegtoBlobtoCavastoPixelDatatoPg获取一个PNG图像base64编码的数据URL并立即显示它：

varode=documet.getElemetById('my-ode');htmlToImage.toPg(ode).the(fuctio(dataUrl){varimg=ewImage();img.src=dataUrl;documet.body.appedChild(img);}).catch(fuctio(error){cosole.error('oops,somethigwetwrog!',error);});获取PNG图像base64编码的数据URL并下载它（使用dowload）：

htmlToImage.toPg(documet.getElemetById('my-ode')).the(fuctio(dataUrl){dowload(dataUrl,'my-ode.pg');});toSvg获取SVG数据URL，但过滤掉所有<i>元素：

fuctiofilter(ode){retur(ode.tagName!=='i');}htmlToImage.toSvg(documet.getElemetById('my-ode'),{filter:filter}).the(fuctio(dataUrl){/*dosomethig*/});toJpeg保存并下载压缩的JPEG图像：

htmlToImage.toJpeg(documet.getElemetById('my-ode'),{quality:0.95}).the(fuctio(dataUrl){varlik=documet.createElemet('a');lik.dowload='my-image-ame.jpeg';lik.href=dataUrl;lik.click();});

html-to-image 是一个使用 HTML5 canvas 和 SVG 从 DOM 节点生成图像的工具。安装
npm install --save html-to-image 用法 ...

声明：本文仅代表作者观点，不代表本站立场。如果侵犯到您的合法权益，请联系我们删除侵权资源！如果遇到资源链接失效，请您通过评论或工单的方式通知管理员。未经允许，不得转载，本站所有资源文章禁止商业使用运营!

下载安装【程序员客栈】APP

实时对接需求、及时收发消息、丰富的开放项目需求、随时随地查看项目状态

前往安装

html-to-image 将 DOM 节点转换成图像的工具开源项目

技术信息

作品详情

功能介绍

重点城市程序员兼职推荐

重点岗位程序员兼职推荐