My first
var re = new GcHtmlBrowser(html);
re.ApplyGcImagingLicenseKey("key");
2. To license all the instances
GcHtmlBrowser.SetGcImagingLicenseKey("key");
7. Write the sample code.
> type=note
> **Note**: DsHtml uses a local copy of a Chromium-based browser. You can either rely on Google Chrome or Microsoft Edge browsers installed in the operating system, or download an instance of the Chromium browser to the application's local folder or some shared folder. If you know the custom path to an installed Chromium-based browser, use it instead of the above-mentioned options.
> The [BrowserFetcher](/document-solutions/dot-net-imaging-api/api/online/DS.Documents.Html/GrapeCity.Documents.Html.BrowserFetcher.html) class can be used to install or fetch an already installed browser, you can then use the BrowserFetcher.GetDownloadedPath() to get the path to the browser.
> See the [BrowserFetcher](/document-solutions/dot-net-imaging-api/api/online/DS.Documents.Html/GrapeCity.Documents.Html.BrowserFetcher.html) class for methods retrieving the path to Chrome or Edge executables and for other options and methods that help to download Chromium browser to a local folder if necessary.
## Render HTML Webpage as Image
1. Get the URI of the HTML webpage you wish to render.
2. Configure image settings using the **PageOptions** class.
3. Convert the HTML page to JPEG, PNG, or WebP image using the **SaveAsPng**, **SaveAsJpeg** or **SaveAsWebP** methods of the **HtmlPage** class.
```csharp
using GrapeCity.Documents.Html;
using System.Drawing;
var browserPath = BrowserFetcher.GetSystemChromePath();
using var browser = new GcHtmlBrowser(browserPath);
var uri = new Uri("Sample2.html", UriKind.Relative);
using var pg = browser.NewPage(uri, new PageOptions
{
WindowSize = new Size(700, 300),
DefaultBackgroundColor = Color.AliceBlue
});
pg.SaveAsPng("Sample2.png");
```
The resulting image is shown below:
> !type=note
> **Note**:
>
> * In order to render an HTML page to image, the fonts used on that page should be already installed on your system.
> * It is important to dispose every instance of the GcHtmlBrowser class after use.
## Render HTML Markup as a Bitmap and Save as Image
1. Get the HTML string or mark up that you wish to render.
2. Store the HTML markup on a new page of the browser instance.
3. Configure image settings using the **PageOptions** class.
4. Create a new instance of [GcBitmap](/document-solutions/dot-net-imaging-api/api/online/DS.Documents.Imaging/GrapeCity.Documents.Imaging.GcBitmap.html) and apply any transformations you need.
5. Use the [SaveAsTiff](/document-solutions/dot-net-imaging-api/api/online/DS.Documents.Imaging/GrapeCity.Documents.Imaging.GcBitmap.SaveAsTiff.html) method to save the image in TIFF format.
Similarly, you can use other SaveAs methods of GcBitmap class to save HTML markup in other image formats.
```csharp
using GrapeCity.Documents.Imaging;
using GrapeCity.Documents.Html;
using System.Drawing;
var browserPath = BrowserFetcher.GetSystemEdgePath();
using var browser = new GcHtmlBrowser(browserPath);
string html = "
JavaScript can change HTML content.
"; using var pg = browser.NewPage(html, new PageOptions { DefaultBackgroundColor = Color.LemonChiffon }); using var bitmap = new GcBitmap(); pg.RenderAndCrop(bitmap, new PngOptions { Scale = 3 }, Color.LemonChiffon, 100, 50, 20, 100); bitmap.SaveAsTiff("Sample3.tiff"); ``` The resulting image is shown below:  ## Draw HTML String or Page on GcGraphics at Specified Position The user can also render HTML content to image using the [DrawHtml](/document-solutions/dot-net-imaging-api/api/online/DS.Documents.Html/GrapeCity.Documents.Drawing.GcBitmapGraphicsExt.DrawHtml.html) method of [GcBitmapGraphicsExt](/document-solutions/dot-net-imaging-api/api/online/DS.Documents.Html/GrapeCity.Documents.Drawing.GcBitmapGraphicsExt.html) class. The [DrawHtml](/document-solutions/dot-net-imaging-api/api/online/DS.Documents.Html/GrapeCity.Documents.Drawing.GcBitmapGraphicsExt.DrawHtml.html) method allows to convert an HTML text or page into an image. It also allows to insert HTML fragments in images along with other content. Moreover, the **DrawHtml** method has two overloads. The GcBitmapGraphics.DrawHtml (string html, float x, float y, HtmlToImageFormat format, out SizeF size) can be used to draw an HTML text on GcBitmapGraphics at a specified position, while the GcBitmapGraphics.DrawHtml (Uri htmlUri, float x, float y, HtmlToImageFormat format, out SizeF size) can be used to draw an HTML page specified by an URI on GcBitmapGraphics at a specified position. To render HTML string or page on **GcBitmapGraphics** at specified position, follow the steps below: 1. Create an instance of **GcBitmap** class. 2. Configure the image settings using the **HtmlToImageFormat** class. 3. Save the HTML page or string on GcBitmapGraphics using the DrawHtmlextension method of [GcBitmapGraphicsExt](/document-solutions/dot-net-imaging-api/api/online/DS.Documents.Html/GrapeCity.Documents.Drawing.GcBitmapGraphicsExt.html) class. 4. Call the **SaveAsJpeg**, **SaveAsPng**, **SaveAsGif**, **SaveAsBmp** and **SaveAsTiff** methods of **GcBitmap** class. ```csharp //Create an instance of GcBitmap class var bmp = new GcBitmap(1000, 1000, true, 96, 96); //Configure image settings HtmlToImageFormat htmlToImage = new HtmlToImageFormat(true) { WindowSize = new Size(500, 500) }; htmlToImage.DefaultBackgroundColor = Color.White; //Draw HTML Page on GcBitmapGraphics using (var g = bmp.CreateGraphics(Color.LightBlue)) { SizeF addSize = new SizeF(); // Create an instance of GcHtmlBrowser that is used to render HTML: var browserPath = BrowserFetcher.GetSystemChromePath(); var browser = new GcHtmlBrowser(browserPath); g.DrawHtml(browser, new Uri("https://www.apple.com/in/"), 10, 10, htmlToImage, out addSize); bmp.SaveAsJpeg("DrawHtml.jpeg"); } ``` The resulting image is shown below:  For more information about rendering HTML to Image using DsImaging, see [DsImaging demo](https://developer.mescius.com/documents-api-imaging/demos/html). ## Tips to Migrate from Obsolete GcHtmlRenderer Class If your application uses obsolete **GcHtmlRenderer** class to convert the HTML pages or content to an image format, you can use following steps to quickly update to the new **GcHtmlBrowser** class which does not depend on a custom build of Chromium and does not require GPL or LGPL licenses. 1. In Solution Explorer, go to Project > **Dependencies** \> **Packages** and remove any references to * GrapeCity.Documents.Html.Windows.X64 * GrapeCity.Documents.Html.Linux.X64 * GrapeCity.Documents.Html.Mac.X64 2. Check for licensing calls and if they exist, change them as follows: ```csharp GcHtmlRenderer.SetGcImagingLicenseKey(key); -> GcHtmlBrowser.SetGcImagingLicenseKey(key); GcHtmlRenderer.SetGcPdfLicenseKey(key); -> GcHtmlBrowser.SetGcPdfLicenseKey(key); ``` 3. In order to create and use an instance of GcHtmlBrowser, you require the path to a Chromium based browser on the current system. For instance, in case of Chrome browser: 1. You can get the path to an existing instance of Chrome installed on the current system. ```csharp var path = BrowserFetcher.GetSystemChromePath(); ``` 2. Or, you can download and install Chrome in a location of your choice. ```csharp var tp = Path.GetTempPath(); var bf = new BrowserFetcher() { DestinationFolder = Path.Combine(tp, ".gc-chromium") }; var path = bf.GetDownloadedPath(); ``` > !type=note > **Note:** We recommend using **Chrome** browser with GcHTMLBrowser class as Edge has some differences in the implementation of some DevTools features. 4. Create an instance of GcHtmlBrowser. Note that **RunWithNoSandbox** option may be needed on some Linux systems. ```csharp if (RuntimeInformation.IsOSPlatform(OSPlatform.Linux)) return new GcHtmlBrowser(path, new LaunchOptions { RunWithNoSandbox = true }); else return new GcHtmlBrowser(path) ``` 5. In all calls to GcGraphics.DrawHtml() method, insert browser instance as the first parameter. ```csharp g.DrawHtml(html, ...); -> g.DrawHtml(browser, html, ...); ``` 6. Look for instances of GcHtmlRenderer class which are rendering Uri such as ```csharp using var re = new GcHtmlRenderer(uri); ... re.RenderToJpeg(file, new JpegSettings() {...}); re.RenderToPng(file, new PngSettings() {...}); ``` and replace them with ```csharp // Create an HtmlPage from the URI // (DefaultBackgroundColor and WindowSize options from Pdf/Jpeg/PngSettings // have moved to PageOptions, while some other options are now in LaunchOptions): using var htmlPage = browser.NewPage(uri, new PageOptions() { WindowSize = pixelSize;… }); ... htmlPage.SaveAsJpeg(file, new JpegOptions() {...}); htmlPage.SaveAsPng(file, new PngOptions() {...}); ``` > !type=note > **Note:** Few methods and properties of JpegSettings and PngSettings classes have been moved to **LaunchOptions** and **PageOptions** classes.