Base64 Image in a Widget

b64widget.js

// this is an example of using a base64 image in an exosite portals widget

function( container, portal )
{
  // this is the actual image, you can generate this string on most
  // mac/linux computers by using `base64 image.png` from the command line
  var base64_image = "iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==";
  
  // helpful for debugging
  console.log('widget refresh');
  
  // this just removes all child elements from the widget container to start fresh
  $(container).empty();
  
  // here we're creating a new image element
  $('<img/>', {
    style: 'width:100%; height:100%', // that fills the widget container
    src: 'data:image/png;base64,' + base64_image, // with the base64 image in png format
  }).appendTo(container); // and appends it to the widget container

// in a real application you would append the image to an element inside your actual widget
// such as a table cell or list item

}