1

我正在使用传单在 django 模板中显示地图。我给出纬度、经度和半径并基于此过滤结果并尝试在地图上添加标记。我怎么无法创建地图标记，因为我不知道如何将地图对象传递给事件，而且我想知道如何从传单中的地址获取 lat lng。

索引.html

<!DOCTYPE html>
<html>
{% load static %} {% load leaflet_tags %}
<head>
    {% leaflet_js %} {% leaflet_css %}        
    <style>
    div#gis {
        height: 500px;
    }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script type="text/javascript" src="{% static 'dist/leaflet.ajax.js' %}"></script>
</head>
<body>      
    {% csrf_token %}
    <label for="latitude">Latitude</label>
    <input type="number" name="latitude" id="latitude" step="any">
    <br />
    <label for="longitude">Longitude</label>
    <input type="number" name="longitude" id="longitude" step="any">
    <br />
    <label for="radius">Radius</label>
    <input type="number" name="radius" id="radius" step="any">
    <br/>
        <button type="submit" onclick="myFunction()">Submit</button>
        <script type="text/javascript">
    let csrftoken = 
    document.cookie.replace(/(?:?:^|.*;\s*)csrftoken\s*\=\s* . 
    ([^;]*).*$)|^.*$/, "$1");   

    function myFunction(){
      lat= document.getElementById('latitude').value
      lon=document.getElementById('longitude').value
      rad=document.getElementById('radius').value          
   $.ajax({
     url: "{% url 'data' %}" + "? 
     latitude="+lat+"&longitude="+lon+"&radius="+rad,
     type: 'POST',
     dataType: 'json',
     headers: { "X-CSRFToken": csrftoken},
     contentType: 'application/json;charset=utf-8',          

    success:function(response){           
        response.features.map((map)=>{
            Lat = map.geometry.coordinates[1]  
            Lon = map.geometry.coordinates[0]                
            L.marker([ Lat,Lon]).addTo(map)                  
        })
    },        
})     
}       
        </script>
        {% leaflet_map "gis" %}  

    </body>
    </html>>
4

0 回答 0