Django - "Google Maps Polygon"をモデルに保存するにはどうすればいいですか？

Question

Googleマップにポリゴンを作成したいのですが、これはDjango/GeoDjangoを使ってpostgres-databaseに投稿する必要があります。

ユーザーがGoogleマップからエリアを選択すると、ポリゴンを保存する必要があります。 これらのポリゴンで計算をやりたい 一方、他のポリゴンを地図上に表示する必要があります。

私はajax/jqueryを使用する必要がありますが、はい、私はdjango noobです。 ：D

（私の英語のため申し訳ありませんが）

モデル

from django.contrib.gis.db import models 

class Area(models.Model): 
owner = models.ForeignKey(User) 
poly = models.PolygonField() 
objects = models.GeoManager() 

Views.py

@csrf_protect 
def create_area(request): 
if request.user.is_authenticated(): 
    return render(request, 'basics/map_claim.html') 

GoogleMaps.js

<script> 
 

 

 
\t var map; 
 
\t var marker; 
 
    var polygon; 
 
\t var myCenter=new google.maps.LatLng(51.508742,-0.120850); 
 
\t var geocoder; 
 
\t var infowindow; 
 
    var polypoints=[]; 
 

 

 
\t function initialize() { 
 
    \t geocoder = new google.maps.Geocoder() 
 
\t \t \t var mapProp = { 
 
    \t \t \t center:myCenter, 
 
    \t \t \t zoom:2, 
 
    \t \t \t mapTypeId:google.maps.MapTypeId.ROADMAP, 
 
\t \t \t \t mapTypeControl: false, 
 
     panControl:false, 
 
     rotateControl:false, 
 
\t \t \t \t mapTypeControl:true, 
 
     streetViewControl: false 
 
    \t \t }; 
 
    \t \t marker=null; 
 

 
    \t \t map = new google.maps.Map(document.getElementById("map-container"),mapProp); 
 
    \t \t google.maps.event.addListener(map, 'click', function(event) { 
 
      polypoints.push(event.latLng); 
 
      placePolygon(); 
 
      console.log(polypoints); 
 
    \t \t }); 
 
\t } 
 

 

 
    function placePolygon(){ 
 
     if(polygon){ 
 
      polygon.setPaths(polypoints); 
 
     } 
 
     else { 
 
       polygon=new google.maps.Polygon({ 
 
       paths: polypoints, 
 
       strokeColor: '#FF0000', 
 
       strokeOpacity: 0.8, 
 
       strokeWeight: 3, 
 
       fillColor: '#FF0000', 
 
       fillOpacity: 0.35, 
 
       editable: true 
 
      }); 
 
     } polygon.setMap(map); 
 
    } 
 

 
\t function getLocation() { 
 
    \t if (navigator.geolocation) { 
 
    \t  navigator.geolocation.getCurrentPosition(showPosition); 
 
    \t } else { 
 
    \t  x.innerHTML = "Geolocation is not supported"; 
 
    \t  y.innerHTML = "by this browser."; 
 
    \t } 
 
\t } 
 

 
\t function showPosition(position) { 
 
    \t var latlng={lat: parseFloat(position.coords.latitude), lng: parseFloat(position.coords.longitude)}; 
 
    \t placeMarker(latlng); 
 
\t } 
 

 

 
\t function placeMarker(location) { 
 
\t  if(marker){ 
 
\t   infowindow.close(); 
 
\t   marker.setPosition(location); 
 
\t   geocoder.geocode({'location': location}, function(results, status){ 
 
\t    infowindow.setContent(results[0].formatted_address); 
 
\t    infowindow.open(map,marker); 
 
\t   }) 
 
\t  } 
 
\t  else{ 
 
\t   marker = new google.maps.Marker({ 
 
\t   position: location, 
 
\t   map: map, 
 
\t   }); 
 
\t   geocoder.geocode({'location': location}, function(results, status){ 
 
\t    infowindow = new google.maps.InfoWindow({content: results[0].formatted_address}); 
 
\t    infowindow.open(map,marker); 
 
\t   }) 
 
\t   \t map.setZoom(6); 
 
\t  } 
 
\t \t map.setCenter(marker.getPosition()); 
 
\t } 
 
\t google.maps.event.addDomListener(window, 'load', initialize); 
 

 
</script> 
 
<script type='text/javascript'> 
 
    \t $('#location-map-modal').on('shown.bs.modal', function(e) { 
 
     initialize(); 
 
    }); 
 

 
</script>

ありがとうございました。 ：/

Answer 1

私は私はあなたが求めているのか理解100％ではないんだけど、それを行うための典型的な方法は、このようになります。インスタンスを作成し、それをデータベースに保存する必要があり

area = Area() 
area.owner = request.User 
area.poly = polygon_data # Assumes you have a variable set to your polygon data 
area.objects = object_data # Assumes you have a variable set to your geo object data 
area.save() 

。

if not area.ID: 
    # Oh noes, didn't save. 

django ORMがどのように機能するかについては、TONのドキュメントがあります。私はそのいくつかを読むことをお勧めしたいと思います。