Databases
StackOverflow2013
Postsdbo
POPassing Googlemap API V. 3 Markers from Python to Javascript via Jinja2
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POPassing Googlemap API V. 3 Markers from Python to Javascript via Jinja2
    text
    copied!<p>I have a list in a GSQL database of markers that I wish to send to javascript so that they can be displayed on a google map. In effect, I pass a python list, which looks something like:</p> <pre><code>[[50.1142, .12231, "MarkerName"], [49.131, -.12232, "MarkerName2"], [48.131, -.12232, "MarkerName3"]] </code></pre> <p>Via a jinja2 template, as the variable 'maplist.' </p> <p>My javascript looks like this on the template:</p> <pre><code>&lt;script type="text/javascript"&gt; $(document).ready(function () { var latitude = parseFloat("51.515252"); var longitude = parseFloat("-0.189852"); var latlngPos = new google.maps.LatLng(latitude, longitude); // Set up options for the Google map var myOptions = { zoom: 10, center: latlngPos, mapTypeId: google.maps.MapTypeId.ROADMAP }; // Define the map map = new google.maps.Map(document.getElementById("map"), myOptions); }); function addMarker(lat, lng, name){ var point = new google.maps.LatLng(lat, lng); var marker = new google.maps.Marker({position: point, map: map, title: name }); }; &lt;/script&gt; </code></pre> <p>I loop through the list like so:</p> <pre><code> {% for marker in maplist %} &lt;script type="text/javascript"&gt; addMarker(parseFloat('{{marker.1}}'),parseFloat('{{marker.2}}'),'{{marker.0}}'); &lt;/script&gt; {% endfor %} </code></pre> <p>However, none of the markers show up on the map. I am not at all confident that my approach is the best, but I had seen it done here: <a href="https://stackoverflow.com/questions/13042679/parsing-dictionary-from-gae-python-to-create-marker-objects-in-javascript-gmap">Parsing dictionary from GAE python to create marker objects in javascript / GMaps api</a>, and it made sense to me. Perhaps JSON is a better approach, in which case I would very much appreciate any salient examples (am basically a total Javscript-neophyte) </p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload