将谷歌地图标记位置发送到拖动的烧瓶

Send Google Maps marker position to Flask whe dragged

本文关键字:拖动 地图 谷歌 图标 位置      更新时间:2023-09-26

我在谷歌地图中有一个可拖动的标记。 我想将标记的位置发送到烧瓶视图。 我该怎么做?

<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>

我自己找到的,在一个伟大的 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')

并存储变量(或任何您需要的内容(