We are creating a workflow for folks to scan through NOAA Harvey aerial imagery to find flooding, flaring, and other pollution incidents at industrial sites:
https://storms.ngs.noaa.gov/storms/harvey/index.html
The problem is that:
- you can't see latitude and longitude on the map as you browse around
- you can't permalink to a particular location or image so that you can share that exact view, for example in a report
I think the NOAA map is probably using some kind of standard map tile display. Can someone write a map with those features that loads the same imagery sets to make it easier for people to report pollution?
Thank you!!!
Adding coordinates to a Mapbox GL map is pretty straight forward.
Not sure that Mapbox GL supports permalinks, but then again I might be misunderstanding this exchange.
I did find a permalink solution for Leaflet, but I think you'd have to do something like this which probably defeats the whole purpose of Mapbox GL.
Getting the NOAA data in there is a step beyond me.
If somebody wants to point me to a repo for this map, I'll add the coordinates code.
Actually, looking at the source code this is just mapbox.js and not mapbox-gl.js. So that permalink solution should work, might need something else for the coordinates.
Ooh, and here are the layers:
var aug27a_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170827-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var aug28a_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170828a-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var aug28b_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170828b-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var aug29a_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170829a-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var aug29b_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170829b-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var aug30a_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170830-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var aug31a_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170831a-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var aug31b_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170831b-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var sept01a_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170901a-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var sept01b_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170901b-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var sept01c_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170901c-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var sept02a_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170902a-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var sept02b_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170902b-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var sept02c_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170902c-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map); var sept03a_ob = new L.mapbox.tileLayer('https://storms.ngs.noaa.gov/storms/tilesd/services/tileserver.php?/20170903a-rgb.json', {errorTileUrl:'../harvey/images/clear.png'}).addTo(map);Is this a question? Click here to post it to the Questions page.
all in https://storms.ngs.noaa.gov/storms/harvey/js/app.js
Reply to this comment...
Log in to comment
There's a good thread going on Twitter on this!
https://twitter.com/PublicLab/status/910574138242273281
Is this a question? Click here to post it to the Questions page.
Is there anyone but me responding to the Twitter?
Is this a question? Click here to post it to the Questions page.
not yet!
Hi, @jbreen -- I'm working on a related Leaflet project if you still have any time to add in the permalink and coords plugins you found -- https://github.com/publiclab/leaflet-archive is designed to try to display a map based on an https://Archive.org image collection, using the GPS Exif tags. If you're looking for a project! Trying to widen the set of imagery we can run through this workflow.
Hi @warren -- just sent you a pull request.
Awesome -- looks super! https://publiclab.github.io/leaflet-archive/#14/30.0679/-93.5891
https://publiclab.github.io/leaflet-archive/#11/30.0602/-93.5753&limit=10 too
Reply to this comment...
Log in to comment
hey guys,
I work on the NOAA pages. I just added permalinks and mouseover lat/lon coords to both the Hurricane Harvey and Irma imagery pages. The changes should be live tomorrow morning.
That's tremendous, thank you Jason! Much obliged.
Wow this is super amazing! Thank you @jasonwool ! So great to meet you.
Permalinks and mouseover Lat/Lons now working on Harvey and Irma pages at: https://storms.ngs.noaa.gov/storms/harvey/index.html and https://storms.ngs.noaa.gov/storms/irma/index.html
Let me know if it doesn't work as expected. Thanks for what you guys do!
It works!!
https://storms.ngs.noaa.gov/storms/harvey/index.html#13/27.9218/-97.1129
awesome!
Hi, @jasonwool - this doesn't seem to be working anymore; can you confirm if it's still up and running? Thanks!
Is this a question? Click here to post it to the Questions page.
hey - Yeah, it seems to be ok here. Working for me in Chrome and FF. What type of error are you seeing?
Is this a question? Click here to post it to the Questions page.
Oh super, it's working again now. Weird, i wonder if it was related to caching somehow... anyways looks good now! Thanks again!
@jasonwool TY for the quick help!
@jasonwool - if you're interested, we would LOVE to meet you in person at the Public Lab Barnraising -- https://publiclab.org/barnraising -- Nov 3-5 in Cocodrie, Louisiana; this is our annual community event and Harvey and Irma imagery (as well as other disaster response issues) will surely be one of the big topics this year.
Thanks again!
Cool! Thanks for the invite. I'll see what I can do.
Reply to this comment...
Log in to comment