Outputting google maps with multiple markers using django-easy-maps?

Question

JavaScript

Hello toaster.
I decided to fasten the map with the image of the objects added earlier. I'm using django-easy-maps battery . Only one trouble, the battery allows you to display only one marker.

{% load easy_maps_tags %}

{% easy_map "Russia, Ekaterinburg, Mira 32" 300 400 %}  --- Выводит один маркер

{% easy_map address 200 200 5 using 'map.html' %} --- Хочу это отредактировать!

I want to edit the map.html template.
Here is the map.html itself

{% with map.latitude|stringformat:"f" as lat %}
{% with map.longitude|stringformat:"f" as long %}

{% block api_js %}
    <!-- Google Maps API javascript -->
    <script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script>
{% endblock %}

{% block html %}
    <!-- HTML map container -->
    <div id="map-canvas-{{ map.pk }}"
        {% if width and map.latitude and not map.geocode_error %}
        style="width: {{ width }}px; height: {{ height }}px;"
        {% endif %}
        class="easy-map-googlemap">
        {% block noscript %}
        <noscript>
        <img alt="Map of {{ map.address }}" src="https://maps.google.com/maps/api/staticmap?center={{ lat }},{{ long }}&zoom={{ zoom }}&markers={{ lat }},{{ long }}&size={{ width }}x{{ height }}&sensor=false">
        </noscript>
        {% endblock noscript %}
        {% if map.geocode_error %}<!-- geocoding error -->{% endif %}
    </div>
{% endblock %}

{% block map_js %}
    <!-- Map creation script -->
    <script type="text/javascript">
        function initialize_map_{{ map.pk }}() {
            var latlng = new google.maps.LatLng({{ lat }}, {{ long }});
            var mapElem = document.getElementById("map-canvas-{{ map.pk }}");

            {% block map_options_js %}
            var mapOptions = {
                zoom: {{ zoom }},
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP
            };
            {% endblock %}

            var map = new google.maps.Map(mapElem, mapOptions);

            {% block extra_js %}
            var marker = new google.maps.Marker({
                position: latlng,
                map: map,
                title: "{{ map.address }}"
            });
            {% endblock %}
        }

        {% block map_loading_js %}
        // initialize the map after page loading
        google.maps.event.addDomListener(window, 'load', initialize_map_{{ map.pk }});
        {% endblock %}
    </script>
{% endblock %}

{% endwith %}
{% endwith %}

I found this example of adding markers in the Google Maps documentation.
Code from the example script

var map;

      function initialize() {
        map = new google.maps.Map(document.getElementById('map'), {
          zoom: 2,
          center: new google.maps.LatLng(2.8,-187.3),
          mapTypeId: google.maps.MapTypeId.TERRAIN
        });

        // Create a <script> tag and set the USGS URL as the source.
        var script = document.createElement('script');
        // (In this example we use a locally stored copy instead.)
        // script.src = 'http://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_week.geojsonp';
        script.src = 'earthquake_GeoJSONP.js';
        document.getElementsByTagName('head')[0].appendChild(script);
      }

      // Loop through the results array and place a marker for each
      // set of coordinates.
      window.eqfeed_callback = function(results) {
        for (var i = 0; i < results.features.length; i++) {
          var coords = results.features[i].geometry.coordinates;
          var latLng = new google.maps.LatLng(coords[1],coords[0]);
          var marker = new google.maps.Marker({
            position: latLng,
            map: map
          });
        }
      }
      google.maps.event.addDomListener(window, 'load', initialize)

Tell me how to properly use the script in map.html to display multiple markers.
Thank you all in advance!

Answer 1

stackoverflow.com/questions/8144005/google-map-to-...