For example:
<img width="1904" alt="Screen Shot 2021-11-05 at 11 59 05 AM" src="https://user-images.githubusercontent.com/29597/140540816-25d6d47b-7aea-4121-aeaa-565accc65b1f.png">

while (x < visibleArea.origin.x + visibleArea.size.width) {
      const snapshot = this._findClosestSnapshot(x);
      if (snapshot === null) {
        
        break;
      }
      const scaledHeight = SNAPSHOT_HEIGHT;
      const scaledWidth = (snapshot.width * SNAPSHOT_HEIGHT) / snapshot.height;
      const imageRect: Rect = {
        origin: {
          x,
          y,
        },
        size: {width: scaledWidth, height: scaledHeight},
      };
      
      if (snapshot.image === null) {
        const img = (snapshot.image = new Image());
        img.onload = () => {
          this._drawSnapshotImage(context, snapshot, imageRect);
        };
        img.src = snapshot.imageSource;
      } else {
        this._drawSnapshotImage(context, snapshot, imageRect);
      }
      x += scaledWidth + BORDER_SIZE;
    }
  }
  handleInteraction(interaction: Interaction, viewRefs: ViewRefs) {