node-html-to-image: Generate Images from HTML

栏目: IT技术 · 发布时间: 4年前

内容简介：This module exposes a function that generates images (png, jpeg) from HTML. It uses puppeteer in headless mode to achieve it. Additionally, it embarksList of all available options:

Welcome to node-html-to-image :sunrise_over_mountains:

A Node.js library that generates images from HTML

:house: Homepage

Description

This module exposes a function that generates images (png, jpeg) from HTML. It uses puppeteer in headless mode to achieve it. Additionally, it embarks Handlebars to provide a way to add logic in your HTML.

Install

npm install node-html-to-image
# or
yarn add node-html-to-image

Usage

const nodeHtmlToImage = require('node-html-to-image')

nodeHtmlToImage({
  output: './image.png',
  html: '<html><body>Hello world!</body></html>'
})
  .then(() => console.log('The image was created successfully!'))

Options

List of all available options:

option	description	type	required
ouput	The ouput path for generated image	string	required
html	The html used to generate image content	string	required
type	The type of the generated image	jpeg or png (default: png)	optional
content	If provided html property is considered an handlebars template and use content value to fill it	object	optional
waitUntil	Define when to consider markup succeded. Learn more .	string or Array	optional
puppeteerArgs	The puppeteerArgs property let you pass down custom configuration to puppeteer. Learn more .	object	optional
transparent	The transparent property let you generate images with transparent background (for png type).	boolean	optional

Setting output image resolution

node-html-to-image takes a screenshot of the body tag's content. If you want to set output image's resolution you need to set its dimension using CSS like in the following example.

const nodeHtmlToImage = require('node-html-to-image')

nodeHtmlToImage({
  output: './image.png',
  html: `<html>
    <head>
      <style>
        body {
          width: 2480px;
          height: 3508px;
        }
      <style>
      </style>
    </head>
    <body>Hello world!</body>
  </html>
  `
})
  .then(() => console.log('The image was created successfully!'))

Example with Handlebars

Handlerbars is a templating language. It generates HTML from a template and an input object. In the following example we provide a template to node-html-to-image and a content object to fill the template.

const nodeHtmlToImage = require('node-html-to-image')

nodeHtmlToImage({
  output: './image.png',
  html: '<html><body>Hello {{name}}!</body></html>',
  content: { name: 'you' }
})
  .then(() => console.log('The image was created successfully!'))

Handlebars provides a lot of expressions to handle common use cases like conditions or loops.

Dealing with images

If you want to display an image which is stored remotely do it as usual. In case your image is stored locally I recommend having your image in base64 . Then you need to pass it to the template with the content property. Here is an example:

const nodeHtmlToImage = require('node-html-to-image')
const fs = require('fs');

const image = fs.readFileSync('./image.jpg');
const base64Image = new Buffer(bitmap).toString('base64');

nodeHtmlToImage({
  output: './image.png',
  html: '<html><body><img src="{{imageSource}}" /></body></html>',
  content: { imageSource: base64Image }
})

node-html-to-image-cli - CLI for this module

Run tests

You need to install tesseract on your computer before launching tests. Here is the procedure for Mac users:

brew install tesseract
brew install tesseract-lang

Launch test:

yarn test

Author

:bust_in_silhouette: FRIN Yvonnick frin.yvonnick@gmail.com

Contributing

Contributions, issues and feature requests are welcome!

Feel free to check issues page .

Show your support

Give a :star:️ if this project helped you!

:memo: License

This project is Apache--2.0 licensed.

This README was generated with :heart: by readme-md-generator

以上就是本文的全部内容，希望本文的内容对大家的学习或者工作能带来一定的帮助，也希望大家多多支持码农网

查看所有标签

猜你喜欢:

node-html-to-image: Generate Images from HTML

本站部分资源来源于网络，本站转载出于传递更多信息之目的，版权归原作者或者来源机构所有，如转载稿涉及版权问题，请联系我们。

码农书籍

解放战争（上）（1945年8月—1948年9月）

王树增 / 人民文学出版社 / 2009-8 / 60.00

《解放战争》为王树增非虚构文学著述中规模最大的作品。武器简陋、兵力不足的军队对抗拥有现代武器装备的兵力庞大的军队，数量不多、面积有限的解放区最终扩展成为九百六十万平方公里的共和国，解放战争在短短四年时间里演绎的是人类历史上的战争传奇。国际风云，政治智慧，时事洞察，军事谋略，军队意志，作战才能，作品具有宏阔的视角和入微的体察，包含着惊心动魄的人生沉浮和变幻莫测的战场胜负，尽展中国历史上规模最大的一场......一起来看看《解放战争（上）（1945年8月—1948年9月）》这本书的介绍吧!

码农工具