mapillary / mapillary-js

Interactive, extendable street imagery map experiences in the browser, powered by WebGL
https://mapillary.github.io/mapillary-js
MIT License
446 stars 85 forks source link

360 panorama image tiling #584

Open chris-cooper opened 1 year ago

chris-cooper commented 1 year ago

Great projects you have here! I'm interested in how to tile large 360 panorama images for use with mapillary-js.

Are there standard open source toolsets for generating tile pyramids that are easy to hook up to mapillary-js with a data provider? Is the tiling scheme used by GraphDataProvider documented publicly? Does an equirectangular image get converted to a cubemap prior to tiling?

Thanks!

oscarlorentzon commented 1 year ago

Thanks for the interest in mapillary-js.

Are there standard open source toolsets for generating tile pyramids that are easy to hook up to mapillary-js with a data provider?

It is possible to use an image server like loris. An image tiles request from mapillary-js (imageId + zoom level) need to be converted to the relevant tiles for that level and that specific image and each tile needs to specify the loris URLs including the IIIF region. Something along this line was done in an earlier version of mapillary-js.

Is the tiling scheme used by GraphDataProvider documented publicly?

It is not documented publicly as of now. The tiling scheme is similar to 2D map tiling schemes (e.g. Bing tiles) in general and is built as quad tree.

For the lowest level, 0, an image can have a maximum size of 1px x 1px. For level 1 is an image can have a maximum size of 2px x 2px. I use maximum size here because most images are not square so the downsized image may also be rectangular.

In mapillary-js we have currently hardcoded the minimum level we request tiles for to 11 and the tile size is set to 1024.

The best documentation for now is the code in the src/tile folder, with the TileMath logic the core of the tiling scheme.

Does an equirectangular image get converted to a cubemap prior to tiling?

No conversion is performed, the equirectangular image is the one that is tiled.

Let me know if you want to pursue a solution and I can provide more insight.

chris-cooper commented 1 year ago

Thanks for the info and links @oscarlorentzon !

oscarlorentzon commented 1 year ago

The optimal solution here would be to break out the image tiling functionality into an ImageTileProvider concept (like the DataProvider and GeometryProvider). Then anyone could implement the ImageTileProvider interface and define their own tiling scheme, tile size etc.