How to add Google Map Markers With Django Template Tags

[DF]

I'm trying to place markers based on the latitude and longitude stored in a model on a Google Map using the API and HTML5 geolocation.

The issue is how to loop through the lat/lon info for each object stored in the database within JavaScript tags using template keywords, which I'm not sure can be done in Django.

I found a similar question which I mildly modified and placed within a template – not a separate script file – but it doesn't seem to work:

    function loadMarkers(){

            {% for story in stories %}

            var point = new google.maps.LatLng({{story.latitude}},{{story.longitude}});

                var marker = new google.maps.Marker({

                position: point,

                map: map

            });

            {% endfor %}    

        }

Any insight on how to properly loop through items in a stored Django object with lat, lon info and place these on a Google Map using the API would be very appreciated.

[DF]

That's interesting, but mine seems like it could be less involved. This is what I attempted, which failed:

http://dpaste.org/55T9x/

[Daniele Procida]

On 31 May 2012, at 21:21, DF wrote:

That's interesting, but mine seems like it could be less involved. This is what I attempted, which failed:

http://dpaste.org/55T9x/

Well, you don't need all the other stuff I discussed, but the key thing is: given some variable (in my example it was place.site.maps) containing a collection of places with lat/long information, you may be able to use my template to do what you need with a little tweaking.

Daniele

[Daniele Procida]

On Thu, May 31, 2012, DF <donfer...@gmail.com> wrote:

>Any insight on how to properly loop through items in a stored Django object
>with lat, lon info and place these on a Google Map using the API would be
>very appreciated.

I do it like this:

<https://github.com/evildmp/Arkestra/blob/master/contacts_and_people/templates/contacts_and_people/place_map.html>

The view for that template is:

<https://github.com/evildmp/Arkestra/blob/master/contacts_and_people/views.py#L234>

It provides the template with the place; the place ("Building" in the models, before I realised I needed to be concerned with places that were not actual buildings) will belong to a Site. Each Site can have one or more Buildings (i.e. places), each of which might have a map.

The Site.maps property in:

<https://github.com/evildmp/Arkestra/blob/master/contacts_and_people/models.py#L36>

contains a list of Buildings that should have a map for each Site.

The template loops over all those buildings to produce the map, right here:

<https://github.com/evildmp/Arkestra/blob/master/contacts_and_people/templates/contacts_and_people/place_map.html#L45>

Results look for example like:

<http://www.aikidocardiff.com/place/talybont-sports-centre/map/>

or

<http://medicine.cf.ac.uk/place/heath-park-henry-wellcome-building/map/>.

However many items are on the map, it will scale to fit them in its bounds.

Let me know here or on irc://irc.freenode.net/arkestra if you need more information.

Daniele