Building an interactive map with Google Maps Platform and React - Crash Course
Leigh Halliday
View ChannelAbout
Hey folks! In this channel I'll be adding tutorials about JavaScript and React. For more information about me, please check out my website at https://www.leighhalliday.com and my Next.js Course at https://next.leighhalliday.com
Video Description
Looking for a crash course on how to build amazing, interactive maps with React and Google Maps Platform? In this video, Leigh Halliday - Engineering manager at Wrapbook - teaches you how to take your maps to the next level. He’ll discuss the basics of using Google Maps in React, how to cluster markers, apply custom styles using a Map ID, and more. Watch this video for a crash course in using React with Google Maps! Subscribe to the Google Maps Platform YouTube → http://goo.gle/GMapsPlatform Follow Google Maps Platform on Twitter → https://goo.gle/GoogleMapsTwitter Check out Google Maps Platform’s blog → https://goo.gle/33YHvRV Source code → https://goo.gle/3K7y07Z Starter code → https://goo.gle/3IDkfxu Chapters: 00:00 - Introduction 01:25 - Loading Google Maps Script 05:30 - Rendering Google Map in React 15:40 - Customizing Styles & Map ID 19:35 - Google Places Search 31:30 - Displaying Office Marker 34:40 - Showing Circles on Map 36:45 - Rendering Houses 39:35 - Clustering Markers 40:55 - Displaying Directions 47:15 - Calculating Distance and Time
Boost Your Map Building Skills
AI-recommended products based on this video
SmallRig Wireless Follow Focus Kit (Lite) with Handwheel Controller & Receiver Motor, A/B Stops & 15mm Rod Clamp, Compact Design, Widely Compatible with Cinema and Zoom Lenses with High Damping - 4296
