tangrams / tangram-es

2D and 3D map renderer using OpenGL ES
MIT License
828 stars 240 forks source link

Geo-referenced images AKA Ground Overlay #866

Closed ac87 closed 5 years ago

ac87 commented 8 years ago

This is more a feature request than a bug.

I would like to be able to draw what Google at least call Ground Overlays onto the map.

I thought I found a way to do it by putting a raster layer with just the image in the right place in the tiles over the vector data. However outside of the few tiles I need the raster layer draw black pixels over the rest of the map.

Thanks

bcamper commented 8 years ago

Hi @ac87, thanks for your feedback.

Supporting Google-style image overlays is an interesting suggestion which we will consider, though probably won't be able to add in the near term. @blair1618: if we added this, we could consider slicing the image into raster tiles on the fly, similar to what geoson-vt does, but for Raster sources (I spoke with someone at State of the Map doing this).

In the meantime, your suggestion of a bounded raster tile source makes sense. We are currently considering the ability to apply a bounding box to any data source (vector or raster), outside which no tiles will be requested. See https://github.com/tangrams/tangram/issues/366.

ac87 commented 8 years ago

Thanks for the feedback, just to be clear this is not for using huge GeoTiffs as a raster overlay (which you have to pre-slice to be able to render) but more small images such as a building floorplan.

I see it being more a mapdata object, perhaps a polygon with image source where the image stretches between the top left and bottom right points in the polygon. Having looked through the issues now, I think this is related to custom markers #763 #653, only the marker is a polygon

ac87 commented 8 years ago

For any other newbie trying to do this, Tangram is more than capable already.

I am still just playing with Tangram and there is a lot to absorb in the docs. Hadn't spotted Geometry Masking

I created tiles for the zooms where I want the image to appear and used a GeoJson file to define the location to render the tiles at.

The other thing I had missed was why transparent pixels in the tile were rendering as black, the raster draw style needed to have blend added, and blend must be a parameter of a style not added to a draw block.

styles:
    raster-blended:
        base: raster
        blend: overlay

sources:
    image-overlay-rasters: { type: Raster, url: 'http://localhost:8888/{x}/{y}/{z}.overlay.png' }
    image-overlay-source:
        type: GeoJSON
        url: image_overlay.json
        rasters: [image-overlay-rasters] # attach image layer

layers:
    overlay-image:
        data: { source:  image-overlay-source }
        draw:
            raster-blended:
                order: 220

Can now see why you had mentioned bounded tile source. That would make this a perfect solution.

bcamper commented 8 years ago

There is indeed a lot to absorb :) We need to improve the learning curve for sure.

Tile bounding box is coming soon (in Tangram JS, then easy to add to ES as well)! https://github.com/tangrams/tangram/issues/366

matteblair commented 5 years ago

Tangram JS has recently added a much easier way of achieving this effect: https://github.com/tangrams/tangram/pull/688

I expect that the best resolution to the need expressed in this issue is to implement this feature, as captured now in https://github.com/tangrams/tangram-es/issues/2032. To consolidate the issues, I'll close this one.