拖动将Google地图标记位置发送到Flask

时间:2016-02-12 22:28:29

标签: javascript python google-maps flask

我在Google地图中有一个可拖动的标记。我想将标记的位置发送到Flask视图。我怎么能这样做?

<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
<body onload='initialize()'>
  Lat:
    <input id="lat" name="lat" val="40.713956" />
  Long:
    <input id="long" name="long" val="74.006653" />
    <div id="map_canvas" style="width: 500px; height: 250px;"></div>

<script>
    var map;

    function initialize() {
        var myLatlng = new google.maps.LatLng({{ lat}}, {{ long }});

        var myOptions = {
            zoom: 8,
            center: myLatlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        var marker = new google.maps.Marker({
            draggable: true,
            position: myLatlng,
            map: map,
            title: "Your location"
        });

        google.maps.event.addListener(marker, 'dragend', function (event) {
            document.getElementById("lat").value = event.latLng.lat();
            document.getElementById("long").value = event.latLng.lng();
        });

        // close popup window
        google.maps.event.addListener(map, 'click', function() {
        infowindow.close();
        });

    }
    google.maps.event.addDomListener(window, "load", initialize());
</script>
</body>

1 个答案:

答案 0 :(得分:1)

在一个伟大的DEV家伙的帮助下找到它。

javascript:

 function initialize() {
    var myLatlng = new google.maps.LatLng({{ geolat }}, {{ geolong }});

    var myOptions = {
        zoom: 16,
        center: myLatlng,
        streetViewControl: true,
        mapTypeControl: true,
        zoomControl: true,
        mapTypeId: google.maps.MapTypeId.SATELLITE
    };
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

    var marker = new google.maps.Marker({
        draggable: true,
        position: myLatlng,
        map: map,
        title: "Your location"
    });

    google.maps.event.addListener(marker, 'dragend', function (event) {
            sendCoords(event.latLng.lat(),event.latLng.lng() )
    });

    // close popup window
    google.maps.event.addListener(map, 'click', function() {
    infowindow.close();
    });

在你的.py脚本中创建get参数,如下所示:

lat = request.args.get('lat')
long = request.args.get('long')

并存储变量(或任何你需要的)