Google Maps JavaScript API Episode 3 - Markers

In this video series, we will be learning about the Google Maps JavaScript API. We will learn everything about the Google Maps JavaScript API ranging from creating a custom Google map to adding symbols, shapes, and more! In this video, we will learn how add markers to our map, interact with markers, and customize markers.

Become a Better Developer

My Software

Download Code

⌛ Timestamps
0:00 - Introduction
1:31 - Adding a Marker to the Map
3:57 - Removing a Marker from the Map
4:48 - Adding Multiple Markers to the Map
7:29 - Customizing a Marker
11:17 - Marker Optimization
12:06 - Make a Marker Respond to Events
15:19 - Marker Animation
18:57 - Dragging a Marker
19:32 - Outro

[kwokashley]

Thank you so much! Love your simple steps and clear explanation!

[clarencearongono]

Best tutorial I've that actually worked!!!

[juanmanueltaboadaalvarez]

amazing tutorial man!
will be liking and commenting on every single one

[dusankuzmanovic]

Nice one, helped a lot. Keep up the good work!

[Jablinskee]

on my way to becoming a professional googler thank you!

[aya]

Thank you for making google map series! I have a request. can you make a video about Directions API that you can get information of distance and time from A to B and multiple places ?

[samborsky_pro]

How can I work with more markers? Maybe in a cycle? Dynamic addition and removal - after map initialization.

[MisterJoesturr-efbh]

How do I add an outline to the text inside the marker?

[eocasio]

These are the best videos. Do you have any on KMLs for Google Maps Javascript? I can't seem to get the Names/Labels to appear with the icons. Perhaps you have some example?

[larry]

Is there a way to use visual foxpro data as locations on the google map javacsript api?

[jeantimex]

Nice video, could you do a video for Advanced Markers?

[josemarcos]

Excellent video. Is it possible to get the coordinates by dragging the marker?

[xavier]

Thanks for this video ! Just wondering, my business idea would require people visiting the interactive map and being able to add a marker by themselves anonymously. Would that be made possible though this Google software? Many thanks, Xavi :)

[rajkumart]

Hi, can you let me know how to change Google map markers at each zoom level

[kompilacjedrogowe]

Thank you for the tutorial. I have a question - how can I add a marker to the map only within a certain city? What functions should I use?

[Will-xlxp]

is it good practice to keep the initial map behavior part of the html file? or on separate js file? THANK YOU! this was really helpful i am new to coding and working on my first google maps api project

[anandrawat]

Why only 11 markers can i add? Could you please tell me how can I add 50 markers in map google api?

[fttx]

Thank you, you saved me. Can you show tags from a google spreadsheet database, for example, can you do it? I'm a beginner with this.

[devstuff]

Hey, I'm struggling with my personal project.. The idea is the map would highlight markers of the nearest recycling sites as soon as the user shares their location. If it's possible please help me

[akshat]

What is the application name in the left