Loading dynamic images

Posted by: david.silva on 3 March 2021, 9:51 pm EST

  • Posted 3 March 2021, 9:51 pm EST


    I've searched throughout the documentation and I couldn't find if this was a possibility. I even tested myself but I could be doing something completely wrong.

    Is there a way to dynamically display a image via URL or Base64, following the supported MIME types of course, via Data Source?

    I have either a external link or a base64 string image coming from our API and I want to use the option DATABASE from the image component, pointing to the parameter corresponding to said value, but it doesn't display anything when I preview the report.

    Thanks in advance,
  • Marked as Answer

    Replied 3 March 2021, 11:23 pm EST

    Hi David,
    If a data set field contains the link to an image file or data, then you can use the External Image Option. You can find the example at https://www.grapecity.com/activereportsjs/demos/Reports/TableWithImage/purejs
    If a field contains base64 encoded data, then you can use the DataBase option, but the data should not contain the base64 header(data:image/png;base64). I attached an example of this approach. I think it should be possible to display an image even if the header is presented, so I am going to report a bug to the development team.
    The documentation will be significantly improved in the upcoming release v2.1. You can find the full schedule at https://www.grapecity.com/blogs/activereports-js-2021-roadmap
Need extra support?

Upgrade your support plan and get personal unlimited phone support with our customer engagement team

Learn More

Forum Channels