Saving image data using web storage

Hey everyone!

So I forked/cloned cesium and started working on implementing offline support for tiles loaded into the map. I have implemented offline support for metadata which comes from Bingmaps.

Now I'm working on saving images into browser storage.

Would it be a good idea to stick the images inside an HTML5 Canvas element and using toDataURL to get the data from the image and storing it as JSON inside web storage? (ref:

If not, is there something else anyone would like to suggest?

Here's my github clone, for reference:


OpenLayers 2 has some support for storing tiles offline:

However, most browser local storage is limited to about 5MB, which means you can’t store many tiles in it. At Camptocamp we’re using Cordova (formally PhoneGap) to build a native application as a workaround this limitation.




Have you looked into the Quota Management APIs for OpenLayers at all? It may only be implemented in Chrome so far, but the general user experience seems ideal, in that the user has the chance to agree to allocate arbitrary amounts of disk space for storage. A prompt for the user would also help avoid abuse like



Thanks for the suggestion. That helped me in figuring out how to store tiles.


I read the different API's on html5rocks and it seems like a combination of FileSystem API and Quota Management API would be a good idea in order to store large amounts of data, but the solution would only work on Chrome. Also, Quota Management is an experimental API and thus implementation might need to be changed later on in case some other standard is adopted. But for now, it seems like a good idea to go ahead with implementation based on these technologies.