1. Produkter
  2.   HTML
  3.   Node.js
  4.   Node-HTML-to-Image
 
  

Gratis Node.js-bibliotek för att skapa bilder från HTML

Ett avancerat open source Node.js-bibliotek för bildbehandling som gör det möjligt för mjukvaruutvecklare att generera JPEG- eller PNG-bilder från HTML-innehåll med CSS-stöd och batchgenerering av bilder via gratis JS API.

Node-HTML-to-Image är en öppen källkodsgem för mjukvaruutvecklare som söker en enkel men kraftfull lösning för att konvertera HTML-innehåll till bilder. Byggd ovanpå Puppeteer, ett populärt Node.js-bibliotek som tillhandahåller ett hög-nivå API för att kontrollera headless Chrome-webbläsare, gör detta verktyg det möjligt för utvecklare att generera bilder från HTML-mallar med minimal ansträngning och kostnad. Det finns flera viktiga funktioner som ingår i biblioteket som underlättar mjukvaruutvecklare i utvecklingsprocessen, såsom konvertering av rå HTML eller fördesignade mallar, skapande av personliga eller datadrivna bilder, stöd för CSS-styling, stöd för flera bildformat, batchgenerering av bilder, anpassning av Puppeteers renderingsalternativ och mycket mer.

Node-HTML-to-Image-biblioteket är en Node.js-modul som tar HTML-mallar och omvandlar dem till statiska bildfiler. Biblioteket är mycket användbart för att generera banners, citatbilder eller marknadsföringsinnehåll dynamiskt baserat på användardata eller fördefinierade mallar. Dessutom är det också mycket användbart för att exportera komplexa datavisualiseringar, diagram eller tabeller som statiska bilder för inkludering i presentationer eller rapporter. Programvaruutvecklare kan bädda in renderade bilder av marknadsföringsinnehåll i e-postmeddelanden för att säkerställa kompatibilitet med e-postklienter som blockerar HTML eller CSS. Med ett lättvikts-API och minimala beroenden är det perfekt för applikationer som behöver generera visuella element dynamiskt. Genom att utforska detta bibliotek och integrera det i dina projekt kan du låsa upp nya nivåer av effektivitet och kreativitet.

Previous Next

Komma igång med Node-HTML-to-Image

Det rekommenderade sättet att installera Node-HTML-to-Image-biblioteket är att använda NPM. Vänligen använd följande kommando för en smidig installation.

Installera Node-HTML-to-Image-biblioteket via NPM


npm install node-html-to-image

Installera Node-HTML-to-Image-biblioteket via Yarn


yarn add node-html-to-image

Du kan också installera det manuellt; ladda ner de senaste versionsfilerna direkt från GitHub -förrådet.

Generera en bild från HTML i Node.js

Att generera bilder från HTML-mallar har blivit en populär metod i moderna applikationer. Det öppna källkodsbiblioteket Node-HTML-to-Image gör det enkelt för mjukvaruutvecklare att konvertera rå HTML eller fördesignade mallar till statiska bildfiler med bara ett par rader kod. Denna funktion eliminerar behovet av komplexa grafiska manipulationsbibliotek och tillhandahåller ett enkelt gränssnitt för att producera visuella utdata. Här är ett exempel som visar hur mjukvaruutvecklare kan konvertera en enkel HTML-sträng till en PNG-bild i node.js-applikationer.

Hur man konverterar en HTML-sträng till en PNG-bild i Node.js-appar?

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

nodeHtmlToImage({
  output: './output.png',
  html: '
Hello, World!
',
})
  .then(() => console.log('Image successfully created!'));

Dynamisk innehållsrendering via Node.js-bibliotek

Node-HTML-to-Image-biblioteket gör det möjligt för mjukvaruutvecklare att skicka variabler till mallar, vilket möjliggör skapandet av personliga eller datadrivna bilder i Node.js-applikationer. Denna funktion är särskilt användbar för applikationer som certifikat, personliga rapporter eller inlägg på sociala medier. Det nedan exempel visar hur en variabel {{name}} dynamiskt ersätts med "Alice" innan bilden renderas i Node.js-applikationer.

Hur man dynamiskt skickar variabler till mall och renderar till bild via Node.js-bibliotek?

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

nodeHtmlToImage({
  output: './personalized.png',
  html: `
    
      
        
Hello, {{name}}!

      
    
  `,
  content: { name: 'Alice' },
})
  .then(() => console.log('Personalized image created!'));

Batchbildgenerering i Node.js

Att generera flera bilder samtidigt är enkelt med det öppna källkodsbiblioteket Node-HTML-to-Image. Med bara några rader kod kan mjukvaruutvecklare generera flera bilder enligt sina behov. Denna funktion är idealisk för massuppgifter, såsom att skapa en serie personliga bilder för en marknadsföringskampanj. Följande exempel visar hur man genererar flera bilder med små förändringar i innehållet. Här genererar varje objekt i innehållsarrayen en separat bild med motsvarande data.

Hur man genererar flera bilder från HTML-innehåll i Node.js-appar?

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

nodeHtmlToImage({
  html: `
Hello, {{name}}!
`,
  content: [
    { name: 'Alice' },
    { name: 'Bob' },
    { name: 'Charlie' },
  ],
})
  .then(() => console.log('Batch images created!'));
 Svenska