Web Maps - Putting the M in Angular web apps!

on YouTube ↗25m

" summary

Demonstrates integrating OpenLayers and Google Maps into Angular without external wrappers and confirms it works end to end, including a dynamic script loader service, use of ViewChild and ngAfterViewInit to mount maps, GeoJSON polygons styled by a loneliness prevalence property, CSV-driven heatmaps and marker layers, custom map styling and gradients, OpenLayers drawing with snapping and export to GeoJSON, and practical choices for tile servers and performance conscious on demand loading.

AI-written summary · about

" chapters (6)

1. 0:00Start
2. 0:43summary We are going to see how easy it is to add a map to your Angular application.
3. 6:56dynamic script loading How to in Angular?
4. 9:37the full component code
5. 18:33other methods
6. 19:42needs customization

" related talks

• 36mAngular with Maps? It’s Maptastic!Katerina Skroumpelou · International Javascript Conference 2018 London
• 23m'OpenLayers: The Open Source Option of Adding Maps on Websites'Krishna Lodha · XtremeJS 2022
• 01h 34mBuild a Web Map with Open Source ToolsLyzi Diamond · Open Source Bridge 2015
• 40mStronger App Architecture Using MapsMatt Gardner · EmberConf 2020
• 46mDiscovering 40 Geo-APIs in 40 MinutesRaúl Jiménez · Codemotion Madrid 2015
• 32m"A Developer's Guide to Open Source Web Mapping Libraries"Courtney Yatteau · Frontrunners 2025
• 43mDiversity in the World of Web ComponentsHoracio Gonzalez, Cyril Balit · DevFest Toulouse 2017
• 12mNext generation Maps with WebGLTravis McPhail · Google I/O 2021