1 | # PDOK Locatieserver Angular Component
|
2 |
|
3 | # Installatie
|
4 | Het installeren van de PDOK Locatieserver Angular Component is eenvoudig met [NPM](https://www.npmjs.com/package/angular-geocoder) via het volgende command: `npm install angular-geocoder --save`
|
5 |
|
6 | De meest recente versie van het PDOK Locatieserver Angular Component ondersteunt Angular 6.X.
|
7 |
|
8 | # Features
|
9 | - Responses worden gelijk geparsed van WKT naar GeoJSON (http://geojson.org/)
|
10 | - Autocomplete functionaliteit
|
11 | - Keypresses (up, down, enter) worden ondersteunt in het doorlopen van de zoek
|
12 | - Ondersteunt zowel RD (EPSG:28992) als WGS84 (EPSG:4326)
|
13 | - Eenvoudig te customizen
|
14 |
|
15 | # Gebruik
|
16 | Om de geocoder te gebruiken in een Angular applicatie moet eerst de `GeocoderModule` worden geïmporteerd in de module waar de geocoder zal komen te staan.
|
17 |
|
18 | `
|
19 | import { GeocoderModule } from 'angular-geocoder';`
|
20 | `@NgModule({`
|
21 | `...`
|
22 | `imports: [GeocoderModule]`
|
23 | `...`
|
24 | `})`
|
25 |
|
26 | Vervolgens kan het `GeocoderComponent` worden geimporteerd in een ander component via de html-tag:
|
27 | `<geocoder> </geocoder>`
|
28 |
|
29 | Om iets met het zoekresultaat van de geocoder te doen, moet er worden geluisterd naar het `placeFound` event:
|
30 | `<geocoder (placeFound)="onPlaceFound($event)> </geocoder>" `
|
31 |
|
32 | `public onPlaceFound(place) {`
|
33 | `// Pan map to place, or something else...`
|
34 | `}`
|
35 |
|
36 | ## Zoeken op specifiek type
|
37 | Er kan gezocht worden op een specifiek type (zoals, `adres`, `weg`, of `perceel`) via de `type` property. Meerdere typen kunnen worden gekozen door ze te scheiden door een komma `,` :
|
38 | `<geocoder type="adres"> </geocoder>" `
|
39 | `<geocoder type="adres,weg,buurt"> </geocoder>" `
|
40 |
|
41 | ## Veranderen placeholder message
|
42 | De placeholder message in de geocoder kan worden veranderd door de `placeholder` property te gebruiken:
|
43 | `<geocoder placeholder="Custom text..."> </geocoder>`
|
44 |
|
45 | ## GeocoderService
|
46 | Het is ook mogelijk om alleen de `GeocoderService` te gebruiken. Deze kan worden geïmporteerd in een andere service of component door de service in de `constructor` van de component of service mee te geven:
|
47 |
|
48 | `constructor(private geocoderService: GeocoderService)`
|
49 |
|
50 | Dit maakt het mogelijk om de 4 verschillende endpoints `free,suggest,lookup,revgeo` te gebruiken zonder de standaard megeleverde zoekbalk. De `GeocoderService` retourneert standaard een `Promise`.
|
51 |
|
52 | ### Extra parameters meegeven
|
53 | Het is mogelijk om extra parameters mee te geven aan de `free,suggest,lookup,revgeo` endpoints. Zo kan bijvoorbeeld een filterquery worden meegegeven die alleen maar BAG objecten retourneert:
|
54 |
|
55 | `this.geocoderService.suggest('Neude', {fq: 'bron:BAG'}).then(result => {`
|
56 | `// do something`
|
57 | `});`
|
58 |
|
59 | Een compleet overzicht over welke parameters bij welk endpoint werken is te vinden in de [API documentatie](https://github.com/PDOK/locatieserver/wiki/API-Locatieserver) van de Locatieserver:
|
60 |
|
61 | # FAQ
|
62 |
|
63 | #### In welk coördinaatsysteem worden de resultaatgeometrieen teruggegeven?
|
64 | Deze worden zowel in het Rijksdriehoekstelsel (EPSG:28992) als in WGS84 (EPSG:4326) teruggegeven.
|
65 |
|
66 | #### Waar kan ik de documentatie van de PDOK locatieserver vinden?
|
67 | https://github.com/PDOK/locatieserver/wiki/API-Locatieserver
|
68 |
|
69 | # Meehelpen?
|
70 | Stuur een mailtje naar info@geogap.nl of kijk voor onze contactgegevens op https://geogap.nl . |
\ | No newline at end of file |