Mushrooms are pretty amazing. Ancient. Weird. Scary. We walked around on a couple of days taking pictures of mushrooms. Each dot represents the geographical location where one or more pictures were taken. The color of the dot indicates who took the picture. Overlapping dots (darker color) indicates multiple pictures.
Click on a dot to see the picture(s). Click again to see the next picture (if more than one picture at the location of the dot) or to return to the map.
The dots are placed on top of a map showing location of our mushroom adventure. The orange lines are the approximate boundary of our property. Learn a little more about our place.
The slider below allows you to walk through the mushrooms. It's not as much fun as clicking on the dots in the map.
Loading images...
People took pictures on their phones. A trick was to turn the phone upside down, so the camera was closer to mushroom level. If actually getting on the ground wasn't practical, then switching to 'selfie' mode on the upside down phone seemed to allow a better angle.
Pictures were sent to me via text, email, etc.; image quality may have been degraded during transfer. Phones may have differed in their concept of location. I used basic features of the MacOS Photos app to remove the 'Live' feature if present, and to export images as medium size, high quality JPEG.
I wrote a small R script to convert the metadata to JSON format for use in the Svelte app. The R script uses exiftoolr to read the EXIF data, and jsonlite to write the JSON file.
The p5.js toolkit is used to render the plot and images, via the p5-svelte component. Maps are drawn using leaflet.
Google Gemini and the resources it used was helpful during many steps,
especially overlaying the P5 and leaflet components. Gemini was sometimes
obstinately unhelpful. A major struggle was realizing that my P5 code was
mostly event driven (p5.noLoop()) so the reactivity provided by
svelte was not actively updating the point locations when I zoomed or moved
the map.
Leaflet (topography map) attribution: Tiles © Esri — Esri, DeLorme, NAVTEQ, TomTom, Intermap, iPC, USGS, FAO, NPS, NRCAN, GeoBase, Kadaster NL, Ordnance Survey, Esri Japan, METI, Esri China (Hong Kong), and the GIS User Community.
The code is available on GitHub, especially MushroomMap.svelte and MushroomSketch.svelte.