By continuing to navigate on this website, you accept the use of cookies to serve you more relevant services & content.
For more information and to change the setting of cookies on your computer, please read our Cookie Policy.

Dynamically Adding Google Maps with Marker In Django

Google Maps allows you to display maps on your website,  we can also customize maps, and the information on maps.

The Google Maps API is a JavaScript library. It can be added to a web page with the following script tags:

 

We are creating a div to holds the google map. Here we are also giving an option to search the place on a google map.

 
   
 

then add a DOM listener that will execute the getGoogleMap() function on window load (when the page is initially loaded):

google.maps.event.addDomListener(window, "load", getGoogleMap)
 

In the above example, we are already loading 3 markers in Bangalore, Chennai, Hyderabad.

Then again if a user marks any location, it will display the marker with longitude, latitude of the place(if u want to store) by deleting user previously selecting markers.


We can also set the position description dynamically using the info window

    Posted On
  • 22 January 2016
  • By
  • Micropyramid

Need any Help in your Project?Let's Talk

Latest Comments
Related Articles
Deploying Your Django app on Heroku

Heroku is a platform as a service (PaaS) that enables developers to build and run applications entirely in the cloud.
1. installation
2. Creating and ...

Continue Reading...
Creating Django App

Django is a high-level, free and open-source Python Web framework that encourages rapid development. Django follows the model–view–controller (MVC) architectural pattern. Django's primary goal is ...

Continue Reading...
Introduction to API development using Django REST framework with Example

Introduction to API development with Django REST framework. You can build the API for any Django application. Pre-requisites are Django and OOPS(object oriented programming concepts) ...

Continue Reading...
open source packages

Subscribe To our news letter

Subscribe and Stay Updated about our Webinars, news and articles on Django, Python, Machine Learning, Amazon Web Services, DevOps, Salesforce, ReactJS, AngularJS, React Native.
* We don't provide your email contact details to any third parties