谷歌地图API JS标记 - Django

Question

在Django中，我试图通过呈现模板与视图中的信息来填充谷歌地图API。

我可以得到结果返回到模板，但是我很难用Django实现它到JavaScript标记中。有什么建议么。

我想Django的数据返回到addmarker功能JS

的Python - Django的访问量

def maps_multi(request): 

     address_list = CustomerOrder.objects.filter(city__icontains = 'CA').distinct() # pulls all unique addresses in California 
     address_list1 = address_list[0:3] # temporarily select first three addresses from list to test 

     geolocator = GoogleV3() 

     add_list=[] 
     for x in address_list1: 
      add_city = x.city 
      location = geolocator.geocode(add_city) 
      add_list.append(location) 
      print(add_list) 

     context = {'location': add_list} 

     return render(request, 'orderdisplay/maps_multi.html', context) 

//JAVASCRIPT 

     // New map 
     var map = new google.maps.Map(document.getElementById('map'), options); 


     // INSERT Lat Lng via django here 
     addMarker({coords:{lat:33.6846, lng:-117.8265}}); 
     addMarker({coords:{lat:34.0522, lng:-118.2437}}); 
     addMarker({coords:{lat:33.9533, lng:-117.3962}}); 



     // Add Marker Function 
     function addMarker(props){ 
     var marker = new google.maps.Marker({ 
      position: props.coords, 
      map:map, 
      icon:'https://developers.google.com/maps/documentation/javascript/examples/full/images/beachflag.png' 
     }); 

     } 
    } 
    </script> 
    <script async defer 
    src="https://maps.googleapis.com/maps/api/js?key=*****&callback=initMap"> 
    </script> 

Answer 1

我假设你的js代码放在你的orderdisplay/maps_multi.html模板内。那么你可以简单地做到这一点：

// New map 
var map = ... 

// INSERT Lat Lng via django here 

{% for location in add_list %} 
    addMarker({coords:{ 
     lat: {{ location.latitude|stringformat:'f' }}, 
     lng: {{ location.longitude|stringformat:'f' }} 
     } 
    }); 
{% endfor %}