JSFiddle - React, Tailwind, and code Playground

HTML

<!DOCTYPE HTML>
<html>
  <head>
    
    <script src="http://www.html5canvastutorials.com/libraries/kinetic-v4.0.1.js"></script>
      
    
<script>
    
      function loadImages(sources, callback) {
         var images = {};
         var loadedImages = 0;
         var numImages = 0;
         // get num of sources
         for(var src in sources) {
            numImages++;
         }
         for(var src in sources) {
            images[src] = new Image();
            images[src].onload = function() {
               if(++loadedImages >= numImages) {
                  callback(images);
               }
            };
            images[src].src = sources[src];
         }
      }
      function draw ( images )
      {
         var stage = new Kinetic.Stage({
            container: "container",
            width: 1900,
            height: 1040,
            draggable: true
         });
         
         var rows = 6;
         var cols = 10;
         var r = 70;
         var circle;
         
         var layer = new Kinetic.Layer({
            x: r,
            y: r
         });
         
         for ( var i = 0; i < rows; i++ )
         {
            for ( var j = 0; j < cols; j++ )
            {
               circle = new Kinetic.Circle({
                  x: j * ( r * 2.5 ),
                  y:  i * ( r * 2.5 ),
                  radius: r,
                  fill:
                  {
                     image: images.darthVader,
                     offset: [ -220, -70 ]
                  },
                  stroke: "black",
                  strokeWidth: 4,
                  draggable: true
               });
               
               circle.on("mouseover touchstart", function() {
                  this.setFill({
                     image: images.yoda,
                     offset: {
                        x: -70,
                        y: -70
                     }
                  });
                  layer.draw();
               });
          ...

CSS

<style>
      body {
        margin: 0px;
        padding: 0px;
      }
      canvas {
        border: 1px solid #9C9898;
      }
    </style>