iodepo / oih-ui

source code for the Ocean InfoHub (OIH) website
https://oceaninfohub.org/
MIT License
5 stars 4 forks source link

Embed kepler.gl (or similar) as map viewer #107

Open pbuttigieg opened 8 months ago

pbuttigieg commented 8 months ago

Relates to #50

https://kepler.gl/ https://github.com/keplergl/kepler.gl

Kepler.gl offers some powerful front-end features to visualise our spatial data.

@fils has prepared a GeoJSON export as well as an H3-element based export which can be ingested into the front end for visualisation. (map image)

@petrocel @maicol07 - can we use this as to solve the MapBox issue we discussed in previous meetings?

The idea is that you can set up a kepler instance that loads the data @fils has prepared, and render that in the UI/UX.

This doesn't have to be kepler, but something similarly capable can work.

pieterprovoost commented 8 months ago

No experience with kepler but considering performance you may want to look into deck.gl with geoparquet as well: https://observablehq.com/@developmentseed/geoarrow-deck-gl-polygon-example (1M polygons). I think deck.gl has a much wider adoption. Maybe also consider tiling your spatial data, tippecanoe can help with that.

fils commented 8 months ago

@pieterprovoost thanks.. exporting to geoparquet should be easy from the current OIH resource flow. Don't know tippecanoe, but will review

jmckenna commented 7 months ago

The CIOOS partner has a nice viewer that leverages these grids: https://explore.cioos.ca/?lang=en

emarzini commented 6 months ago

@fils has prepared a GeoJSON export as well as an H3-element based export which can be ingested into the front end for visualisation. (map image)

Regarding this kind of activity, we would know better the goal and the output made by @fils and how it should influence the frontend development

emarzini commented 6 months ago

The CIOOS partner has a nice viewer that leverages these grids: https://explore.cioos.ca/?lang=en

Starting from the idea under the example provided by @jmckenna we build a mockup of new way to present the viewer (we can see together in the next meeting).

In parallel we build PoC regarding the usage of H3 and mapbox, without using deck.gl or kepler.gl. We have some open points to clarify, first of all the possible different data we could receive from the backend (see previous comment)

Anyway, here a screenshot of our PoC.

jmckenna commented 6 months ago

Very interesting @emarzini, I look forward to your demo next week.

emarzini commented 6 months ago

Do you have some example of MapTiles as OSM without borders? We are stuck finding someone.

pieterprovoost commented 5 months ago

@emarzini We have a MapBox account so we can create custom base layers, would this style work?