This example is using canvs toDataURL method for getting image data

image_cache.js

//This example is using canvs toDataURL method  for getting image data
//Save image for offline useage
localstorage_image_cache("f5b2-0b98-cf5f");
//Save image in local storage
function localstorage_image_cache(graphic_image_component_id) {
  //Return if browser is not firefox
  if (typeof InstallTrigger == 'undefined') return;
  // localStorage with image
  var storage_files = JSON.parse(localStorage.getItem(graphic_image_component_id)) || {},
    //Get Image
    graphc_image = document.querySelector("#component-" + graphic_image_component_id + " img");
  if (!graphic_image) return alert("Please use a valid component id");
  //Create a images
  var img = new Image();
  img.crossOrigin = 'Anonymous';
  img.src = graphic_image.src;
  $(img)
    .one('load', function() {
      if (img.complete && img.naturalHeight !== 0) {
        console.log("image loaded successfully")
        var imgCanvas = document.createElement("canvas"),
          imgContext = imgCanvas.getContext("2d");

        // Make sure canvas is as big as the picture
        imgCanvas.width = graphic_image.width;
        imgCanvas.height = graphic_image.height;

        // Draw image into canvas element
        imgContext.drawImage(img, 0, 0, graphic_image.width, graphic_image.height);

        // Save image as a data URL
        storage_files.graphic_image = imgCanvas.toDataURL("image/png");

        // Set name for localStorage
        storage_files.src = img.src;

        // Save as JSON in localStorage
        try {
          localStorage.setItem(graphic_image_component_id, JSON.stringify(storage_files));
        }
        catch (e) {
          console.log("Storage failed: " + e);
        }
      }
      else {
        //Get iamge from local storage
        $(graphic_image).attr({
          'src': storage_files.graphic_image
        });
      }
    })
    .on('error', function() {
      // Use image from localStorage
      $(graphic_image).attr({
        'src': storage_files.graphic_image
      });
    });
}

image_cache_1.js

//This is a javascript code that allow  image caching offline  for a  graphic element
//This example is using html 5  File Api to get image data.
//Please replace current component id with your graphic element id
localstorage_image_cache("722c-e69a-c6db");
//Save image in local storage
function localstorage_image_cache(graphic_image_component_id) {
  //Return if browser is not firefox
  if (typeof InstallTrigger == 'undefined') return;
  // LocalStorage with image
  var storage_files = JSON.parse(localStorage.getItem(graphic_image_component_id)) || {},
  //Get Image
  graphic_image = document.querySelector("#component-" + graphic_image_component_id + " img");
  //Display error if component not found
  if (!graphic_image) return alert("Please use a valid component id .e.g. 722c-e69a-c6db ");
  //Set Image src again to make sure emit onload event
  graphic_image.src = graphic_image.src;
  //Execute logic
  $(graphic_image)
    .one('load', function() {
      if (graphic_image.complete && graphic_image.naturalHeight !== 0) {
        console.log("image loaded successfully")
        var xhr = new XMLHttpRequest();
        xhr.onload = function() {
          var reader = new FileReader();
          reader.onloadend = function() {
            // Save image as a data URL
            storage_files.graphic_image = reader.result;
            // Set name for localStorage
            storage_files.src = graphic_image.src;
            // Save as JSON in localStorage
            try {
              localStorage.setItem(graphic_image_component_id, JSON.stringify(storage_files));
            }
            catch (e) {
              console.log("Storage failed: " + e);
            }
          }
          reader.readAsDataURL(xhr.response);
        };
        xhr.open('GET', graphic_image.src);
        xhr.responseType = 'blob';
        xhr.send();
      }
      else {
        //Get iamge from local storage
        $(graphic_image).attr({
          'src': storage_files.graphic_image
        });
      }
    })
    .on('error', function() {
      // Use image from localStorage
      $(graphic_image).attr({
        'src': storage_files.graphic_image
      });
    });
}
//ENd