SOLVED SEED BELOW: So my game is like an RPG board game to look at a square a player is standing closer I want them to right click on it and it will make the entire screen a blown up pic of the square they are standing and show any items on the ground on that square.

Do I need to make an entity for the zoomed in hex? I'm having trouble accessing the tile to be zoomed in on's picture in a data type that I can use to assign the correct image for the zoomed in entity. Also this wouldn't really get the same effect if there were overlapping entities

Here is how I did the entity
ig.module (
   'game.entities.hexzoom'
)

.requires(
   'impact.entity'
)

.defines(function(){
   var HEX_SIZE = 55;   
   EntityHexzoom = ig.Entity.extend({
      size: {x: 55, y: 55}, 
      animSheet: new ig.AnimationSheet( 'media/hexes.png', HEX_SIZE, HEX_SIZE),
      zIndex:996,  //cursor is above this
      pos: {x: 220, y:220},  //relative to player's location
      scale: { x: 7, y: 7 },
      
      init: function( x, y, settings ) {
         // Add the animations
         this.addAnim( 'a', 0.1, [0] );
         this.addAnim( '1', 0.1, [1] );
         this.addAnim( '2', 0.1, [2] );
         this.addAnim( '3', 0.1, [3] );
         this.addAnim( '4', 0.1, [4] );
         this.addAnim( '5', 0.1, [5] );
         this.addAnim( '6', 0.1, [6] );
         this.addAnim( '7', 0.1, [7] );
         this.addAnim( '8', 0.1, [8] );
         this.addAnim( '9', 0.1, [9] );
         this.addAnim( '10', 0.1, [10] );

         this.currentAnim = this.anims.a;
         this.parent( x, y, settings );
      },
      
      update: function(){
        this.parent();
      },

      draw: function(){
		var ctx = ig.system.context;
		ctx.save();
		ctx.translate( ig.system.getDrawPos( this.pos.x.round() - this.offset.x - ig.game.screen.x ),
				 ig.system.getDrawPos( this.pos.y.round() - this.offset.y - ig.game.screen.y ) );
		ctx.scale( this.scale.x, this.scale.y );
		this.currentAnim.draw( 0, 0 );
		ctx.restore();
	}
   });
})

just spawn it from there