1

I have a tif that I cut out the two sections of and merged them together into one tif and then processed it. Shown below is the original and the processed cuts (not to scale). Between the two processed cuts are nodata values. My original mosaic is already tiled. How would I go about displaying the tiled cuts that I have over the original tiled mosaic so I can see both of them at once in leaflet?

original mosaic

enter image description here

Update: For my example above if I want to overlay the red images over the mosaic above it all that is needed to add it to the map layers variable in leaflet and make sure that the red images have no data values for the pixels in between them.

Improve this question

1 Answer 1

Reset to default
2

If I understand correctly, you have 2 sets of tiles:

  • The aerial imagery (your top image).
  • The "processed cuts" (your bottom image), derived from the above, that you would like to superimpose onto the above tile set, and in particular have the areas of no interest ("no data" / white areas?) be transparent.

Obviously the "easiest" solution would have been to set your "no data" areas as transparent pixels in your tile set in the first place. Not sure however how you would configure your tool to export your TIFF into tiles with transparency.

Another "easy" solution would be to apply an opacity < 1 to your whole superimposed tile set. If you go that direction, you may be interested in Leaflet.OpacityControls plugin, which provides a slider to dynamically adjust the opacity of your tile layer.

A more complex solution is available if you have the coordinates of boundaries of your areas of interest (ideally as GeoJSON polygon / multipolygon). In that case, you would be interested in TileLayer.BoundaryCanvas plugin: given the usual parameters and options of a Tile Layer + an extra option specifying those boundaries, it provides with a Canvas Tile Layer where areas outside of your boundaries are transparent, while areas of interested are filled with your normal tiles.

Not sure whether you can combine the last solution with the opacity controls plugin…

See also:

Improve this answer
1
  • Thanks, I used the opacity controls plugin and just hid the control from the user for the UI I wanted. This made the "processed cuts" appear over top of the aerial imagery and the white areas (no data values) in the "processed cuts" appeared transparent just like I wanted.
    – BFlint
    Commented Jan 4, 2016 at 15:10

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.