How to Use Base64 Image Data in Bold Reports

Base64 encoding serves as a fundamental tool for seamlessly embedding images into various document types, including the professionally generated reports within Bold Reports. This comprehensive article offers an in-depth, step-by-step guide to help you effectively display Base64-encoded images in Bold Reports. By following our instructions and utilizing the provided insights, you can elevate the visual quality and functionality of your reports with ease.

1. Start by opening the Report Design in Bold Reports and adding the image item where you want to display the Base64-encoded image.
   

   

2. Use the following expression to transform and display the Base64 image correctly. This expression removes the first 22 characters and substitutes data:image/png;base64, with an empty string:

=REPLACE(Fields!ImageData.Value, "data:image/png;base64,", "")

3. Alternatively, you can use the following expression to trim the first 22 characters from the base64 image to display it correctly.

=Right(Fields!ImageData.Value, Len(Fields!ImageData.Value) - 22)

4. After adding the expression, save your changes in the Report Design and then preview the report to see the Base64-encoded image displayed correctly.
   
   

By following the above steps and using the provided expressions, you can successfully display Base64-encoded images in Bold Reports by removing the initial 22 characters and substituting the prefix with an empty string. This allows you to integrate Base64 images seamlessly into your reports. You can download the above report from here.