WBC 50 Hikes Challenge
By @RobLabs
This map was custom built for the Sierra Club San Diego. The North County Group is highlighting their 50 Hike Challenge.
- Link to the full screen map: RobLabs.com/50
Video: Demo of 50 Hike Challenge map
Colophon
Architecture & Design Choices
The map is based on Apple Maps, interactive maps on the Web, which offers standard and satellite maps types. While Apple Maps will work on most browsers for desktop and mobile, the customer may want to view the landmark in their favorite map app on their mobile phone.
The landmark callouts were designed with a mobile first experience in mind.
Tapping on a hike location brings up the landmark callout. From there the customer can choose a link to open a map app that offers features they expect: directions, map printing, saving & sharing of landmarks via text or social media, or possibly offline map downloads. Customers viewing this map on Mac, iPhone or Android can enjoy the proper map app for their system. Making a map also should take into consideration a customers privacy1.
Landmark callout with hike details, and links to Apple or Google Maps.
Embedded interactive Apple maps for the web offer standard and satellite maps types.
1Apple states that “Maps helps you find your way without compromising your privacy”.
Cartography
- The landmark callout include the distance, elevation and comments as provided by the Sierra Club.
- The layout of the landmark callout is handled by Apple Maps, with customization of HTML elements such as headers and links.
- The font for the landmark callouts is Montserrat which is also one of the 50 hikes (Monserate Mountain Trail).
- The color palette for the landmark callouts also comes from the North County Group
-
#00bfff
, RGB = (0, 191, 255), DeepSkyBlue -
#f4a460
, RGB = (244, 164, 96), SandyBrown
-
Square images ready for social media
Inaja Trail and Santa Ysabel Open Space Preserve East & West.
Observatory Trail Overlook and Lower Doan Valley & French Valley
Apple Guides
Apple Guides was announced in June 2020 as a new product for their Maps app.
Explore new places with Guides in Maps on iPhone. Guides from trusted brands and partners are available in the Maps app. In the Maps app , you can organize places into your own guides. Add a place to your Guides on your iPhone: Tap “Save to,” then choose one of your guides.
- Apple Guides for the 50 Hike Challenge
- Errata: Apple Guides shows that there are only 42/50 landmarks when clicking on the link. But all 50 landmarks are there. So use with caution.
Data
CSV
The raw data can be found at wbc50.csv. You can view the data in the browser or download the raw data.
Include the map on your site
iframe
for use in other websites
<iframe allowfullscreen="true"
mozallowfullscreen="true" webkitallowfullscreen="true"
style="height: 85vh; width: 95vw;"
src="https://3linemaps.com/50.html">
<p>Your browser does not support iframes.</p>
</iframe>
List of Hikes
Click here for the list of hikes in HTML format. With links to Apple Maps & Google Maps. 👉
- 1. Battle Mountain Trail Apple Maps | Google Maps
- 2. Bernardo Mountain Apple Maps | Google Maps
- 3. Black Canyon Apple Maps | Google Maps
- 4. Blue Sky Reserve to Lake Ramona Apple Maps | Google Maps
- 5. Boden Canyon Apple Maps | Google Maps
- 6. Buena Vista Park Loop Apple Maps | Google Maps
- 7. Caballo Trail to Stanley Peak Apple Maps | Google Maps
- 8. Cedar Creek Falls Apple Maps | Google Maps
- 9. Clevenger Canyon North Apple Maps | Google Maps
- 10. Clevenger Canyon South Apple Maps | Google Maps
- 11. Coast to Crest San Pasqual Valley Apple Maps | Google Maps
- 12. Daley Ranch - Boulder Loop Apple Maps | Google Maps
- 13. Daley Ranch - Englemann Oak Trail Apple Maps | Google Maps
- 14. Daley Ranch - Ranch House Apple Maps | Google Maps
- 15. Del Dios Highlands Preserve Trail Apple Maps | Google Maps
- 16. Double Peak Trail Apple Maps | Google Maps
- 17. Elfin Forest Recreational Reserve Apple Maps | Google Maps
- 18. Ellie Lane Trail Apple Maps | Google Maps
- 19. Fry Koegel Trail Apple Maps | Google Maps
- 20. Hellers Bend Preserve Apple Maps | Google Maps
- 21. Highland Valley Trail Apple Maps | Google Maps
- 22. Inaja Trail Apple Maps | Google Maps
- 23. Iron Mountain Trail Apple Maps | Google Maps
- 24. Lake Hodges - North Shore Apple Maps | Google Maps
- 25. Lusardi Loop Trail Apple Maps | Google Maps
- 26. Los Jilgueros Apple Maps | Google Maps
- 27. Love Valley Apple Maps | Google Maps
- 28. Lower Doan Valley and French Valley Apple Maps | Google Maps
- 29. Monserate Mountain Trail Apple Maps | Google Maps
- 30. Mt Gower Trail Apple Maps | Google Maps
- 31. Mule Deer Trail to Denk Mountain Apple Maps | Google Maps
- 32. Mule Hill Trail Apple Maps | Google Maps
- 33. Observatory Trail Overlook Apple Maps | Google Maps
- 34. Pamo Valley Apple Maps | Google Maps
- 35. Paradise Mountain Trail Apple Maps | Google Maps
- 36. Piedras Pintadas Trailhead Apple Maps | Google Maps
- 37. Questhaven Road Nature Trail Apple Maps | Google Maps
- 38. Rancho Guajome Adobe Apple Maps | Google Maps
- 39. Raptor Ridge Apple Maps | Google Maps
- 40. Santa Fe Valley Trail Apple Maps | Google Maps
- 41. Santa Margarita County Preserve Apple Maps | Google Maps
- 42. Santa Ysabel Open Space Preserve East Apple Maps | Google Maps
- 43. Santa Ysabel Open Space Preserve West Apple Maps | Google Maps
- 44. Sycamore Canyon Preserve Apple Maps | Google Maps
- 45. Tooth Rock Trail Apple Maps | Google Maps
- 46. Twin Peaks Trail Apple Maps | Google Maps
- 47. Van Damm Mountain Apple Maps | Google Maps
- 48. Vista Conservancy Nature Trail Apple Maps | Google Maps
- 49. West Side Road Apple Maps | Google Maps
- 50. Wilderness Gardens Preserve Apple Maps | Google Maps
License
Images
App icons in the landmark callouts are sourced from Wikipedia.
- Apple Maps logo
- Attribution: Apple Inc.SVG by CMetalCore, Public domain, via Wikimedia Commons
- This map is an independent publication and has not been authorized, sponsored, or otherwise approved by Apple Inc. Apple is a trademark of Apple Inc., registered in the U.S. and other countries and regions.
- Google Maps logo
- Attribution: Google Inc.SVG by Premeditated, Public domain, via Wikimedia Commons
- The “Google Maps™” name and other trademarks are property of Google LLC
- NOAA log
- Attribution: Badseed, Public domain, via Wikimedia Commons
- This map is an independent publication and has not been authorized, sponsored, or otherwise approved by National Oceanic and Atmospheric Administration nor the United States Government.