HOW TO: Use a MutationObserver with the LEADTOOLS ImageViewer and Annotations

var myImage = document.getElementById("myImage");
myImage.src = "https://example.com/sample.png";

window.onload = function() {
   // Get the container DIV  
   var imageViewerDiv = document.getElementById("imageViewerDiv");
   // Create the image viewer inside it  
   var createOptions = new lt.Controls.ImageViewerCreateOptions(imageViewerDiv);
   var imageViewer = new lt.Controls.ImageViewer(createOptions);
   // Add handler to show an alert on errors  
   imageViewer.itemError.add(function(sender, e) {
      alert("Error loading " + e.data.srcElement.src);
   });
   // Since we are setting the imageURL of imageViewer to null, the annotations will not be
   // useable with the initial window.onload event, until the value is changed.
   imageViewer.imageUrl = null;

   //Now we add the mutation Listener
   var MutationObserver = window.MutationObserver || window.WebKitMutationObserver
                          || window.MozMutationObserver;

   // Input the ID of the image that you are changing the source of via an external handler
   var myImageElement = document.querySelector(‘#myImage’);

   var observer = new MutationObserver(function(mutations) {
      mutations.forEach(function(mutation) {
         if (mutation.type === “attributes”)
            imageViewer.imageUrl = myImageElement.src;
      });
   });
   observer.observe(myImageElement, {
      attributes: true
   });

   // Rest of demo code
};