Carte des Risques - Alg\u00e9rie<\/title>\n <meta name=\"viewport\" content=\"width=device-width, initial-scale=1.0\">\n\n \n <link rel=\"stylesheet\" href=\"https:\/\/unpkg.com\/leaflet\/dist\/leaflet.css\" \/>\n <style>\n body, html { margin: 0; padding: 0; font-family: sans-serif; }\n #map { height: 100vh; cursor: default; }\n\n .mode-container, .filtre-container, .zone-select {\n position: absolute;\n background: rgba(255, 255, 255, 0.9);\n padding: 10px;\n border-radius: 8px;\n box-shadow: 0 0 10px rgba(0,0,0,0.3);\n z-index: 1000;\n }\n\n .mode-container { top: 10px; right: 10px; }\n .filtre-container { top: 10px; left: 10px; font-size: 0.9em; opacity: 0.8; }\n .zone-select { top: 150px; left: 10px; display: none; }\n\n #formulaire {\n display: none;\n position: fixed;\n top: 10%;\n left: 50%;\n transform: translateX(-50%);\n background: white;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 0 15px rgba(0,0,0,0.4);\n z-index: 2000;\n width: 300px;\n }\n #formulaire input, #formulaire select, #formulaire textarea {\n width: 100%;\n margin-bottom: 10px;\n padding: 5px;\n }\n #formulaire button {\n background-color: #007bff;\n color: white;\n border: none;\n padding: 8px;\n cursor: pointer;\n }\n #closeForm {\n background-color: red;\n color: white;\n border: none;\n padding: 5px 10px;\n cursor: pointer;\n float: right;\n }\n <\/style>\n<\/head>\n<body>\n<div class=\"mode-container\">\n <label><input type=\"radio\" name=\"mode\" value=\"data\" checked> Afficher les donn\u00e9es<\/label><br>\n <label><input type=\"radio\" name=\"mode\" value=\"form\"> Demander un service<\/label>\n<\/div>\n\n<div class=\"filtre-container\" id=\"filtreContainer\">\n <strong>Filtres :<\/strong><br>\n \n <label><input type=\"checkbox\" id=\"seismesChk\" checked> S\u00e9ismes<\/label><br>\n \n <label><input type=\"checkbox\" id=\"inondationsChk\" checked> Inondations<\/label><br>\n <label><input type=\"checkbox\" id=\"incendiesChk\" checked> Incendies<\/label><br>\n <label><input type=\"checkbox\" id=\"glissementsChk\" checked> Glissements de terrain<\/label><br>\n <label><input type=\"checkbox\" id=\"neigeChk\" checked> Temp\u00eate de neige<\/label><br>\n <label><input type=\"checkbox\" id=\"erosionChk\" checked> \u00c9rosion c\u00f4ti\u00e8re<\/label><br>\n <label><input type=\"checkbox\" id=\"sableChk\" checked> Temp\u00eate de sable<\/label><br>\n \n <label><input type=\"checkbox\" id=\"sableChk\" checked> Tassement diff\u00e9rentiel<\/label><br>\n \n <label><input type=\"checkbox\" id=\"sableChk\" checked> Affaissement du sol <\/label><br>\n \n <label><input type=\"checkbox\" id=\"sableChk\" checked> Instabilit\u00e9 des pentes <\/label><br>\n \n <label><input type=\"checkbox\" id=\"sableChk\" checked> \u00c9rosion du sol <\/label><br>\n \n <label><input type=\"checkbox\" id=\"sableChk\" checked> Liqu\u00e9faction du sol<\/label><br>\n \n <label><input type=\"checkbox\" id=\"sableChk\" checked> Rupture de talus <\/label><br>\n \n \n<\/div>\n\n<div class=\"zone-select\" id=\"zoneSelect\">\n <p>Activez le mode \"Demander un service\", puis cliquez sur une zone de la carte pour ouvrir le formulaire.<\/p>\n<\/div>\n\n<div id=\"map\"><\/div>\n\n<div id=\"formulaire\">\n <button id=\"closeForm\">X<\/button>\n <form method=\"POST\" action=\"https:\/\/digitalsecurity-dz.com\/geodata\/send_mail.php\">\n <h3>Demande de service<\/h3>\n\n <input type=\"text\" name=\"zone\" id=\"zone\" placeholder=\"Zone\" readonly>\n <input type=\"text\" name=\"coordonnees\" id=\"coordonnees\" placeholder=\"Coordonn\u00e9es\" readonly>\n\n <label for=\"service\">Service :<\/label>\n <select name=\"service\" required>\n <option value=\"Microzonage\">Microzonage<\/option>\n <option value=\"Mod\u00e8le pr\u00e9dictif\">Mod\u00e8le pr\u00e9dictif<\/option>\n <option value=\"Base de donn\u00e9es\">Base de donn\u00e9es<\/option>\n <option value=\"\u00c9tude et expertise\">\u00c9tude et expertise<\/option>\n <option value=\"Mod\u00e8les num\u00e9riques de terrain\">Mod\u00e8les num\u00e9riques de terrain<\/option>\n <option value=\"Signalement des instabilit\u00e9s\">Signalement des instabilit\u00e9s<\/option>\n <option value=\"Signalement d\u2019un risque\">Signalement d\u2019un risque<\/option>\n <\/select>\n\n <label for=\"contact\">Mode de contact :<\/label>\n <select name=\"contact\">\n <option value=\"WhatsApp\">WhatsApp<\/option>\n <option value=\"Appel\">Appel<\/option>\n <option value=\"Email\">Email<\/option>\n <option value=\"Viber\">Viber<\/option>\n <option value=\"SMS\">SMS<\/option>\n <\/select>\n\n <input type=\"text\" name=\"nom\" placeholder=\"Votre nom\" required>\n <input type=\"email\" name=\"email\" placeholder=\"Votre email\" required>\n <input type=\"tel\" name=\"t\u00e9l\u00e9phone\" placeholder=\"T\u00e9l\u00e9phone\">\n\n <label for=\"rdv\">Rendez-vous :<\/label>\n <select name=\"rdv\">\n <option value=\"En ligne\">En ligne<\/option>\n <option value=\"Pr\u00e9sentiel\">Pr\u00e9sentiel<\/option>\n <\/select>\n <input type=\"datetime-local\" name=\"datetime\" required>\n\n <textarea name=\"message\" placeholder=\"Votre message...\"><\/textarea>\n <button type=\"submit\">Envoyer<\/button>\n <p>Merci pour votre demande. Nous vous contacterons sous peu.<\/p>\n <\/form>\n<\/div>\n\n<script src=\"https:\/\/unpkg.com\/leaflet\/dist\/leaflet.js\"><\/script>\n<script>\n var map = L.map('map').setView([28.0, 2.0], 5);\n L.tileLayer('https:\/\/{s}.tile.opentopomap.org\/{z}\/{x}\/{y}.png', {\n maxZoom: 17,\n attribution: '\u00a9 OpenTopoMap contributors'\n }).addTo(map);\n\n const formulaire = document.getElementById('formulaire');\n const zoneInput = document.getElementById('zone');\n const coordInput = document.getElementById('coordonnees');\n\n document.querySelectorAll('input[name=\"mode\"]').forEach(radio => {\n radio.addEventListener('change', () => {\n formulaire.style.display = 'none';\n const showZoneHelp = document.querySelector('input[name=\"mode\"]:checked')?.value === 'form';\n document.getElementById('zoneSelect').style.display = showZoneHelp ? 'block' : 'none';\n document.getElementById('map').style.cursor = showZoneHelp ? 'pointer' : 'default';\n });\n });\n\n document.getElementById('closeForm').addEventListener('click', () => formulaire.style.display = 'none');\n\n const couches = {\n seismes: L.layerGroup().addTo(map),\n inondations: L.layerGroup().addTo(map),\n incendies: L.layerGroup().addTo(map),\n glissements: L.layerGroup().addTo(map),\n neige: L.layerGroup().addTo(map),\n erosion: L.layerGroup().addTo(map),\n sable: L.layerGroup().addTo(map)\n };\n\n document.querySelectorAll('.filtre-container input[type=\"checkbox\"]').forEach(cb => {\n cb.addEventListener('change', () => {\n const layer = couches[cb.id.replace('Chk', '')];\n if (cb.checked) {\n map.addLayer(layer);\n } else {\n map.removeLayer(layer);\n }\n });\n });\n\n function onMapClick(e) {\n const mode = document.querySelector('input[name=\"mode\"]:checked')?.value;\n if (mode !== 'form') return;\n const { lat, lng } = e.latlng;\n zoneInput.value = \"Zone manuelle\";\n coordInput.value = `${lat.toFixed(4)}, ${lng.toFixed(4)}`;\n formulaire.style.display = 'block';\n }\n\n map.on('click', onMapClick);\n<\/script>\n<\/body>\n<\/html>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>TESSERA Carte des Risques – Alg\u00e9rie Afficher les donn\u00e9es Demander un service Filtres : S\u00e9ismes Inondations Incendies Glissements de terrain Temp\u00eate de neige \u00c9rosion c\u00f4ti\u00e8re Temp\u00eate de sable Tassement diff\u00e9rentiel Affaissement du sol Instabilit\u00e9 des pentes \u00c9rosion du sol Liqu\u00e9faction du sol Rupture de talus Activez le mode \u00ab\u00a0Demander un service\u00a0\u00bb, puis cliquez sur une […]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"site-sidebar-layout":"no-sidebar","site-content-layout":"page-builder","ast-site-content-layout":"full-width-container","site-content-style":"default","site-sidebar-style":"default","ast-global-header-display":"","ast-banner-title-visibility":"","ast-main-header-display":"","ast-hfb-above-header-display":"","ast-hfb-below-header-display":"","ast-hfb-mobile-header-display":"","site-post-title":"disabled","ast-breadcrumbs-content":"","ast-featured-img":"disabled","footer-sml-layout":"","ast-disable-related-posts":"","theme-transparent-header-meta":"","adv-header-id-meta":"","stick-header-meta":"","header-above-stick-meta":"","header-main-stick-meta":"","header-below-stick-meta":"","astra-migrate-meta-layouts":"set","ast-page-background-enabled":"default","ast-page-background-meta":{"desktop":{"background-color":"var(--ast-global-color-4)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"ast-content-background-meta":{"desktop":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"tablet":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""},"mobile":{"background-color":"var(--ast-global-color-5)","background-image":"","background-repeat":"repeat","background-position":"center center","background-size":"auto","background-attachment":"scroll","background-type":"","background-media":"","overlay-type":"","overlay-color":"","overlay-opacity":"","overlay-gradient":""}},"footnotes":""},"class_list":["post-1351","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/digitalsecurity-dz.com\/geodata\/wp-json\/wp\/v2\/pages\/1351","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/digitalsecurity-dz.com\/geodata\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/digitalsecurity-dz.com\/geodata\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/digitalsecurity-dz.com\/geodata\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/digitalsecurity-dz.com\/geodata\/wp-json\/wp\/v2\/comments?post=1351"}],"version-history":[{"count":31,"href":"https:\/\/digitalsecurity-dz.com\/geodata\/wp-json\/wp\/v2\/pages\/1351\/revisions"}],"predecessor-version":[{"id":1621,"href":"https:\/\/digitalsecurity-dz.com\/geodata\/wp-json\/wp\/v2\/pages\/1351\/revisions\/1621"}],"wp:attachment":[{"href":"https:\/\/digitalsecurity-dz.com\/geodata\/wp-json\/wp\/v2\/media?parent=1351"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}