Google Maps API JS Marker - Django

Question

Djangoでは、ビューからの情報でテンプレートをレンダリングすることによってGoogleマップAPIを生成しようとしています。

私は結果をテンプレートに戻すことができますが、私はDjangoでjavascriptタグに実装するのが難しいです。助言がありますか。

私はDjangoのデータはJS

Pythonでaddmarker関数に返すしたいと思います - 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 %}