Recherche WFS

Retour

Cette section à pour but de montrer la recherche dans une ou plusieurs sources WFS:

  • Recherche limitée aux communes du Val de Marne (94):
    • exemples: Ivry sur Seine, Vitry sur Seine, Maison Alfort et Alfortville
    • Fonctionne avec le nom ou leur code insee, exemples: 94041, 94081, 94046, 94002
    • Au choix de la parcelle, l'outil zoom sur celle-ci
Démo
{
  "jsLib": [
    "https://karteis.sct.saas-gfi.eu/dist/mapviewer/latest/karteis-mapviewer-var.js"
  ]
}
<!-- Ne pas utiliser dans votre code -->
<!-- La déclaration du css n'est utile que pour l'affichage sur le site d'exemples -->
<link rel="stylesheet" href="/mapviewer/mapviewer.css">
<!-- Ne pas utiliser dans votre code -->

<!-- Dans nos exemple on utilise font-awesome pour afficher les icones de boutons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">

<!-- Le div qui sera utilisé pour injecter la carte -->
<div id="kmap" style="height:400px;" />

// Initialisation de la carte avec ses plugins
const kmapvInstance = (new kmapv.Mapviewer({
    mapdiv: document.getElementById('kmap'), // Il est aussi possible d'utiliser directement l'id du div contenant la carte
    projection: 'EPSG:3857',
    defaultCenter: [0, 6094400],
    defaultZoom: 5,
    minZoom: 5,
    maxZoom: 22,
}))
 .use(kmapv.CommonLayer({})) // charge le plugin générique des calques
 .use(kmapv.BackgroundLayer({})) // charge le plugin de prise en charge des fond de plans
 .use(kmapv.DataLayer({})) // chage le plugin de prise en charge des couche de données


// Ajout du fond de plan OSM
kmapvInstance.backgroundLayer.addBackgroundLayer(
    'background-osm', // identifiant
    'osm', // type
    {
        idGroup: "FondDePlan", // groupe ou ajouter le calque
        title: 'OSM', // libellé
        zIndex: 0, // z-order
        baseLayer: false // les calques avec baseLayer = true dans un même groupe s'affiche avec un radiobutton (un seul a la fois)
})

// paramètre de la recherche
const placeholder = 'Rechercher';
const maxItems =  20;
const typing = 300; // durée en ms avant de lancer la requête
const minLength = 1;
const label = "Rechercher une parcelle"

// sources en cascade dans l'ordre
const wfsSources = [
{
    name: 'commune',
    wfs: {
        url: 'https://data.geopf.fr/wfs/ows?SERVICE=WFS', // url du service WFS
        version: '2.0.0'
    },
    featureNS: 'CADASTRALPARCELS.PARCELLAIRE_EXPRESS', // Namespace (voir avec https://wxs.ign.fr/parcellaire/geoportail/wfs?SERVICE=WFS&VERSION=2.0.0&REQUEST=GetCapabilities )
    featurePrefix: 'CADASTRALPARCELS.PARCELLAIRE_EXPRESS', // prefix de la source a interroger
    featureTypes: ['commune'], // liste des couches
    searchIn:['code_insee','nom_com'], // recherche ce que l'utilisateur va taper dans ces champs
    prefilter: { // préfiltrage sur une des propriétée : ici on va rechercher uniquement dans les communes ou code_insee in ('94041','94081','94046','94002')
      //code_insee: ['94041','94081','94046','94002']
      code_dep: "94"
    },
    value:['code_dep','nom_com','code_insee'], // valeur a utiliser lorsque l'utilisateur choisi un élement de la liste
    display:'nom_com', // libellé a afficher dans la liste
    placeholder: 'Nom com. ou code insee', // surcharge du placeholder de la zone de recherche pour cette étape
    searchString: 'common' /* valeurs de common :{
      // caractères a remplacer pour la recherche (ici remplace par un "joker")
      replace: {
        '-':'\\*',
        ' ':'\\*',
      },
      // caractères considéres comme "les mêmes"
      same: [
        'aàâä',
        'eéèêë',
        'iîï',
        'oôö',
        'uùûü',
        'yÿ',
        'cç'
      ]
    }*/
  },
  {
    name: 'section',
    wfs: {
        url: 'https://data.geopf.fr/wfs/ows?SERVICE=WFS', // url du service WFS
        version: '2.0.0'
    },
    featureNS: 'CADASTRALPARCELS.PARCELLAIRE_EXPRESS',
    featurePrefix: 'CADASTRALPARCELS.PARCELLAIRE_EXPRESS',
    featureTypes: ['feuille'],
    searchIn: ['section'],
    prefilter: {
      code_dep: '__PREVIOUS_RESULT__.commune.code_dep', // on utilise le resultat de la recherche précedente pour préfiltrer
      //nom_com: '__PREVIOUS_RESULT__.commune.nom_com' // on utilise le resultat de la recherche précedente pour préfiltrer
      code_com: '__PREVIOUS_RESULT__.commune.<%= code_insee.slice(2) %>' // on utilise le resultat de la recherche précedente pour préfiltrer
    },
    useBbox:true, // tente d'utiliser la bbox du résultat fin le plus proche comme filtre, géométrie est nécessaire
    geometryName: 'geom', // nom de la propriété géométrie
    value:'section',
    display:'section',
    placeholder: 'Section'
  },
  {
    name: 'parcelle',
    wfs: {
        url: 'https://data.geopf.fr/wfs/ows?SERVICE=WFS', // url du service WFS
        version: '2.0.0'
    },
    featureNS: 'CADASTRALPARCELS.PARCELLAIRE_EXPRESS',
    featurePrefix: 'CADASTRALPARCELS.PARCELLAIRE_EXPRESS',
    featureTypes: ['parcelle'],
    searchIn: ['numero'],
    prefilter: {
      code_dep: '__PREVIOUS_RESULT__.commune.code_dep', // on utilise le resultat de la recherche précedente pour préfiltrer
      //nom_com: '__PREVIOUS_RESULT__.commune.nom_com' // on utilise le resultat de la recherche précedente pour préfiltrer
      code_com: '__PREVIOUS_RESULT__.commune.<%= code_insee.slice(2) %>', // on utilise le resultat de la recherche précedente pour préfiltrer
      section: '__PREVIOUS_RESULT__.section.section'
    },
    value:'numero',
    display:'numero',
    useBbox:true,
    geometryName: 'geom', // nom de la propriété géométrie
    placeholder: 'Numéro',
    minLength: 2, // surcharge du nombre de caractère minimum a taper
  }
]

kmapvInstance.addSearchControl({
    provider: 'wfs',
    label,
    placeholder,
    maxItems,
    minLength,
    wfsSources
})






Dernière mise à jour:
Contributors: Jerome Mare