Экспортировать полигоны в Geojson и KML - PullRequest
Новая
       41

Экспортировать полигоны в Geojson и KML

0 голосов
/ 27 сентября 2019

Я нахожусь в процессе разработки веб-приложения в Django, где пользователь может выбрать многоугольник и затем экспортировать его в geojson и kml.

Мне удалось создать многоугольник, но я могуне могу понять, как экспортировать его в геойсон.

Когда я выполняю описанную ниже процедуру, карта исчезает со страницы?

Есть идеи или вы что-то заметили в моем коде? 

<div class='calculation-box'>
  <p>Selectionnez votre parcelle à l'aide de l'outil ligne ou polygone.</p>
  <div id='calculated-area'></div>
</div>
  <script>
  mapboxgl.accessToken = 'pk.eyJ1IjoiaGFtemFiIiwiYSI6ImNrMHdwYmQ2bzA2OGYzbHB1Z292eGxneDgifQ.rGPQjaoWuOdnq_UdxAfQ_w';
  var map = new mapboxgl.Map({
    container: 'map',
    style: 'mapbox://styles/mapbox/satellite-streets-v10',
    center: [-7.60,33.57],
    zoom: 5,
    bearing: 0
  });

  var geoJsonFeatures;
  var draw = new MapboxDraw({
  displayControlsDefault: true,
  });

    map.addControl(draw);
    map.addControl(new mapboxgl.NavigationControl());


    document.getElementById('export').onclick = function(e) {
            // Extract GeoJson from featureGroup
            var data = Draw.getAll();

            if (data.features.length > 0) {
                // Stringify the GeoJson
                var convertedData = 'text/json;charset=utf-8,' + encodeURIComponent(JSON.stringify(data));

                // Create export
                document.getElementById('export').setAttribute('href', 'data:' + convertedData);
                document.getElementById('export').setAttribute('download','data.geojson');    
            } else {
                alert("Wouldn't you like to draw some data?");
            }

  map.on('draw.create', updateArea);
  map.on('draw.delete', updateArea);
  map.on('draw.update', updateArea);

  function updateArea(e) {
    var data = draw.getAll();
    var answer = document.getElementById('calculated-area');
    if (data.features.length > 0) {
      var area = turf.area(data);
      // restrict to area to 2 decimal points
      var rounded_area = Math.round(area*100)/1000000;
      answer.innerHTML = '<p><strong>' + rounded_area + '</strong></p><p>hectares</p>';
    } else {
      answer.innerHTML = '';
      if (e.type !== 'draw.delete') alert("Selectionnez votre parcelle à l'aide de l'outil ligne ou polygone!");
    }
  }
</script>
...