Stitching Several Images Together Using Javascript

Question

Hi!

I'm currently coding a game that makes use of Google Maps' Static API - http://code.google.com/apis/maps/documentation/staticmaps/ However, a limitation of the API means that I can only get a maximum of 640x640 images from it and I need much larger images for my game.

As such I'm just wondering if it's possible to stitch multiple smaller images into one bigger image using Javascript?

Thanks,

DLiKS

Answer 1

If you are just trying to display them visually, then just put them in a table with no padding/margin.

If you really need them together in a single object, then use HTML5 Canvas and drawImage.

• https://developer.mozilla.org/en/HTML/Canvas
• http://dev.opera.com/articles/view/html-5-canvas-the-basics/

Answer 2

I had seen one which uses OpenLayers, check it out if it is useful for you... http://www.geoext.org/