Het is mogelijk om afbeeldingen van HTML en schermafbeeldingen van URL's een transparante achtergrond te geven. Dit werkt echter alleen als de achtergrond van de HTML die wordt vastgelegd transparant is en het afbeeldingsformaat PNG of TIFF is. Als u een ander afbeeldingsformaat dan PNG of TIFF gebruikt, krijgt u een zwarte achtergrond.
Om ervoor te zorgen dat een HTML-document een transparante achtergrond heeft, moet de CSS-achtergrondeigenschap voor beide worden ingesteld op transparant html
en body
tags zoals weergegeven in de onderstaande voorbeelden.
GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret"); ImageOptions options = new ImageOptions(); options.Format = ImageFormat.png; options.Transparent = true; grabzIt.HTMLToImage("<html><head><style>html,body{background:transparent}</style></head><body><h1>Hello World!</h1></body></html>" , options); grabzIt.SaveTo("result.png");
GrabzItClient grabzIt = new GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret"); ImageOptions options = new ImageOptions(); options.setFormat(ImageFormat.PNG); options.setTransparent(true); grabzIt.HTMLToImage("<html><head><style>html,body{background:transparent}</style></head><body><h1>Hello World!</h1></body></html>" , options); grabzIt.SaveTo("result.png");
<script src="https://cdn.jsdelivr.net/npm/@grabzit/js@3.5.2/grabzit.min.js"></script>
<script>
GrabzIt("Sign in to view your Application Key").ConvertHTML(
"<html><head><style>html,body{background:transparent}</style></head><body><h1>Hello World!</h1></body></html>",
{"format":"png","transparent":1}).Create();
</script>
var grabzit = require('grabzit'); var client = new grabzit("Sign in to view your Application Key", "Sign in to view your Application Secret"); client.html_to_image("<html><head><style>html,body{background:transparent}</style></head><body><h1>Hello World!</h1></body></html>", {"format":"png","transparent":1}); client.save_to("result.png", function (error, id){ if (error != null){ throw error; } });
$grabzIt = GrabzItClient->new("Sign in to view your Application Key", "Sign in to view your Application Secret"); $options = GrabzItImageOptions->new(); $options->format("png"); $options->transparent(1); $grabzIt->HTMLToImage("<html><head><style>html,body{background:transparent}</style></head><body><h1>Hello World!</h1></body></html>", $options); $grabzIt->SaveTo("result.png");
$grabzIt = new \GrabzIt\GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret"); $options = new \GrabzIt\GrabzItImageOptions(); $options->setFormat("png"); $options->setTransparent(true); $grabzIt->HTMLToImage("<html><head><style>html,body{background:transparent}</style></head><body><h1>Hello World!</h1></body></html>", $options); $grabzIt->SaveTo("result.png");
grabzIt = GrabzItClient.GrabzItClient("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzItImageOptions.GrabzItImageOptions() options.format = "png" options.transparent = True grabzIt.HTMLToImage("<html><head><style>html,body{background:transparent}</style></head><body><h1>Hello World!</h1></body></html>", options) grabzIt.SaveTo("result.png")
curl
-d key=Sign in to view your Application Key
-d format=png
-d transparent=1
-d html=%3Chtml%3E%3Chead%3E%3Cstyle%3Ehtml%2Cbody%7Bbackground%3Atransparent%7D%3C%2Fstyle%3E%3C%2Fhead%3E%3Cbody%3E%3Ch1%3EHello%20World%21%3C%2Fh1%3E%3C%2Fbody%3E%3C%2Fhtml%3E
https://api.grabz.it/services/convert
grabzIt = GrabzIt::Client.new("Sign in to view your Application Key", "Sign in to view your Application Secret") options = GrabzIt::ImageOptions.new() options.format = "png" options.transparent = true grabzIt.html_to_image("<html><head><style>html,body{background:transparent}</style></head><body><h1>Hello World!</h1></body></html>", options) grabzIt.save_to("result.png")