Update pages/HelvetiMap.py

pages/HelvetiMap.py

@@ -25,19 +25,18 @@ class PrintFormatControl(MacroElement):
             var printFormatControl = L.control({position: 'topright'});
             printFormatControl.onAdd = function (map) {
                 var div = L.DomUtil.create('div', 'print-format-control');
-                div.innerHTML = `
-                    <label for="format-select">Format:</label>
-                    <select id="paper-format" name="format-select">
-                        <option value="A4">A4</option>
-                        <option value="A3">A3</option>
-                        <option value="A2">A2</option>
-                        <option value="A1">A1</option>
-                        <option value="A0">A0</option>
-                    </select>
-                    <label for="scale-input">Échelle:</label>
-                    <input id="scale-input" type="number" value="1000" min="1" step="100">
-                    <button id="apply-format">Appliquer</button>
-                `;
+                div.innerHTML = 
+                    '<label for="format-select">Format:</label>' +
+                    '<select id="paper-format" name="format-select">' +
+                        '<option value="A4">A4</option>' +
+                        '<option value="A3">A3</option>' +
+                        '<option value="A2">A2</option>' +
+                        '<option value="A1">A1</option>' +
+                        '<option value="A0">A0</option>' +
+                    '</select>' +
+                    '<label for="scale-input">Échelle:</label>' +
+                    '<input id="scale-input" type="number" value="1000" min="1" step="100">' +
+                    '<button id="apply-format">Appliquer</button>';
                 L.DomEvent.disableClickPropagation(div);
                 return div;
             };
@@ -76,7 +75,7 @@ class PrintFormatControl(MacroElement):
                     color: "#ff7800",
                     weight: 1,
                     draggable: true
-                }).addTo(window.drawnItems);
+                }).addTo({{ this._parent.get_name() }});
 
                 // Attacher un événement de clic pour afficher le GeoJSON
                 window.rectangleLayer.on('click', function(e) {
@@ -100,7 +99,7 @@ def main():
     st.title("SwissScape - Générateur de fonds de plans pour Paysagistes")
 
     st.markdown("""
-    Utilisez la carte interactive pour définir votre zone d'intérêt, choisissez votre format papier et votre échelle, 
+    Utilisez la carte interactive pour définir votre zone d'intérêt, choisissez votre format papier et votre échelle,
     puis exportez facilement votre fond de plan.
     """)
 
@@ -117,50 +116,19 @@ def main():
     # Ajouter les contrôles de format et d'échelle
     m.add_child(PrintFormatControl())
 
+    # Activer le plein écran et les contrôles sur la carte
+    Fullscreen().add_to(m)
+    
+    # Ajouter le plugin Draw pour dessiner des formes sur la carte
+    draw = Draw(export=True)
+    draw.add_to(m)
+
     # Créer un groupe pour les objets dessinés
     drawn_items = folium.FeatureGroup(name="Dessins")
     m.add_child(drawn_items)
 
-    # Ajouter les outils de dessin Leaflet
-    draw_control = Draw(
-        draw_options={
-            "rectangle": True,
-            "polygon": True,
-            "polyline": True,
-            "circle": True,
-            "marker": True
-        },
-        edit_options={"edit": True, "remove": True},
-    )
-    m.add_child(draw_control)
-
-    # Ajouter un bouton d'export GeoJSON
-    export_button = """
-    <button id="export" class="btn btn-primary" style="position:absolute; top:10px; right:10px; z-index:9999;">Export GeoJSON</button>
-    <script>
-    document.getElementById("export").onclick = function() {
-        var data = window.drawnItems.toGeoJSON();
-        var convertedData = 'text/json;charset=utf-8,' + encodeURIComponent(JSON.stringify(data));
-        var a = document.createElement('a');
-        a.href = 'data:' + convertedData;
-        a.download = 'data.geojson';
-        a.innerHTML = 'Download GeoJSON';
-
-        var container = document.getElementById('export');
-        container.appendChild(a);
-        a.click();
-        container.removeChild(a);
-    }
-    </script>
-    """
-    m.get_root().html.add_child(folium.Element(export_button))
-
-    # Activer le plein écran et les contrôles sur la carte
-    Fullscreen().add_to(m)
-    folium.LayerControl().add_to(m)
-
     # Afficher la carte
     folium_static(m, width=800, height=600)
 
 if __name__ == "__main__":
-    main()
+    main()