Embedding Bitmaps and Images

When you want to embed an image in HTML using Base64 encoding, you need to acquire the binary data of the image either by reading the image file or receiving it through a network request. In this example, we have imported the image we want to use and acquired its binary data. Then, using the Convert.ToBase64String method, we successfully converted it to Base64. Through this method, you will be able to add your images to any HTML content that you are using to render PDF documents.

Steps to Embedding Bitmaps and Images

// Read the image file into a byte array
byte[] pngBinaryData = File.ReadAllBytes("replace_with_your_image_path_here.png");

// Convert the image binary data to a Base64 string
string base64String = Convert.ToBase64String(pngBinaryData);

// Construct the Data URI scheme for embedding the image using the Base64 string
string imgDataUri = "data:image/png;base64," + base64String;

// Create an HTML image element with the Base64 data URI as its source
string imgHtml = $"<img src='{imgDataUri}'>";

// Create a new instance of the PDF rendering engine
var renderer = new ChromePdfRenderer();

// Render the HTML with the embedded image as a PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(imgHtml);

// Save the PDF document to a file
pdf.SaveAs("YourPdfFileName.pdf");
// Read the image file into a byte array
byte[] pngBinaryData = File.ReadAllBytes("replace_with_your_image_path_here.png");

// Convert the image binary data to a Base64 string
string base64String = Convert.ToBase64String(pngBinaryData);

// Construct the Data URI scheme for embedding the image using the Base64 string
string imgDataUri = "data:image/png;base64," + base64String;

// Create an HTML image element with the Base64 data URI as its source
string imgHtml = $"<img src='{imgDataUri}'>";

// Create a new instance of the PDF rendering engine
var renderer = new ChromePdfRenderer();

// Render the HTML with the embedded image as a PDF
PdfDocument pdf = renderer.RenderHtmlAsPdf(imgHtml);

// Save the PDF document to a file
pdf.SaveAs("YourPdfFileName.pdf");
CONVERTER NOT RUNNING
$vbLabelText   $csharpLabel

Explanation

  1. Read the Image File:

    • Use File.ReadAllBytes to read the contents of an image file into a byte array, pngBinaryData.
  2. Convert to Base64:

    • Convert.ToBase64String is used to convert the binary data into a Base64-encoded string, base64String.
  3. Create Data URI:

    • Construct a Data URI scheme by prepending "data:image/png;base64," to the Base64 string, resulting in imgDataUri.
  4. Prepare HTML:

    • Create an HTML <img> tag, imgHtml, with the Data URI as the src attribute, embedding the image directly into the HTML.
  5. Render HTML to PDF:

    • Initialize a ChromePdfRenderer instance and use RenderHtmlAsPdf to convert the HTML string into a PdfDocument.
  6. Save the PDF:
    • Finally, save the rendered PDF document using the SaveAs method, specifying the desired file name.

For a more comprehensive guide, including additional examples and sample code, visit this How-to Guide.