17 avr. 2020
Introduction
Pour les besoins d'un de nos projets, nous avons réalisé une librairie Angular 9 pour utiliser l'API Adresse mis à disposition par le gouvernement : https://geo.api.gouv.fr/adresse
Cette api permet de remonter "La Base Adresse Nationale", qui est une base de données qui a pour but de référencer l'intégralité des adresses du territoire français.
Cette librairie, compatible Universal (SSR), permet un typage fort des ressources GeoJSON ainsi que l'utilisation de RxJS.
Elle couvre deux cas d'usage :
- Retrouver les informations d'une Adresse (coordonnées, ville...)
- Trouver l'adresse la plus proche d'un lieu géographique
Nous avons pensé qu'elle pourrait intéresser la communauté, c'est pour cette raison que nous l'avons rendu disponible pour tous !
Installation
npm install @placeme/ngx-geo-api-gouv-address --save
Cette librairie manipule des objets GeoJSON, vous devrez donc aussi installer cette dépendance afin de bénéficier du typage.
npm install geojson --save
Usage
Import du module GeoApiGouvAddressModule
:
import { NgModule } from "@angular/core";
import { CommonModule } from "@angular/common";
import { GeoApiGouvAddressModule } from "@placeme/ngx-geo-api-gouv-address";
import { AppComponent } from "./app.component";
@NgModule({
declarations: [AppComponent],
imports: [CommonModule, GeoApiGouvAddressModule.forRoot()],
})
export class AppModule {}
Utilisation du service GeoApiGouvAddressService
:
API de recherche d'adresses par texte :
import { Component, OnInit } from "@angular/core";
import {
GeoApiGouvAddressResponse,
GeoApiGouvAddressService,
} from "@placeme/ngx-geo-api-gouv-address";
@Component({
selector: "app-root",
templateUrl: "./app.component.html",
styleUrls: ["./app.component.scss"],
})
export class AppComponent implements OnInit {
constructor(private geoApiGouvAddressService: GeoApiGouvAddressService) {}
ngOnInit(): void {
this.geoApiGouvAddressService
.query({ q: "27 rue des Blanchers, 31000 Toulouse" })
.subscribe((geoApiGouvAddressResponse: GeoApiGouvAddressResponse) => {
console.log(geoApiGouvAddressResponse);
});
}
}
Le service query permet d'utiliser tous les paramètres de l'API, voici la définition de l'interface QueryRequestParams
:
interface QueryRequestParams {
q: string;
limit?: number;
autocomplete?: number;
lat?: number;
lon?: number;
type?: GeoApiGouvAddressType;
postcode?: string;
citycode?: string;
}
API de recherche d'adresses par coordonnées :
import { Component, OnInit } from "@angular/core";
import {
GeoApiGouvAddressResponse,
GeoApiGouvAddressService,
} from "@placeme/ngx-geo-api-gouv-address";
@Component({
selector: "app-root",
templateUrl: "./app.component.html",
styleUrls: ["./app.component.scss"],
})
export class AppComponent implements OnInit {
constructor(private geoApiGouvAddressService: GeoApiGouvAddressService) {}
ngOnInit(): void {
this.geoApiGouvAddressService
.reverse({ lat: 43.602508, lon: 1.437591 })
.subscribe((geoApiGouvAddressResponse: GeoApiGouvAddressResponse) => {
console.log(geoApiGouvAddressResponse);
});
}
}
Le service reverse permet d'utiliser tous les paramètres de l'API, voici la définition de l'interface ReverseRequestParams
:
interface ReverseRequestParams {
lat: number;
lon: number;
type?: GeoApiGouvAddressType;
}
Utilisation de la réponse GeoApiGouvAddressResponse
:
La réponse est au format standardisé GeoJSON, voici la définition de l'interface ReverseRequestParams
:
import { Feature, FeatureCollection } from "geojson";
export type GeoApiGouvAddressType =
| "housenumber"
| "street"
| "locality"
| "municipality";
export interface GeoApiGouvAddress {
id: string;
type: GeoApiGouvAddressType;
score: number;
housenumber?: string;
name?: string;
postcode: string;
citycode: string;
city: string;
district?: string;
oldcitycode?: string;
oldcity?: string;
context: string;
label: string;
x: number;
y: number;
importance: number;
}
export interface GeoApiGouvAddressFeatureCollection extends Feature {
properties: GeoApiGouvAddress;
}
export interface GeoApiGouvAddressResponse extends FeatureCollection {
features: GeoApiGouvAddressFeatureCollection[];
}
Utilisation de cette api :
Cette API ne nécessite pas d'authentification et permet de faire 10 appels par IP / seconde.