This guide is in Finnish, because it is part of an article written in Finnish. Documentation in English can be found from OpenMapTiles and Mapbox websites. Tämä ohje on suomeksi, koska sen on tarkoitus olla osa suomenkielistä artikkelia Skrolli-lehdessä. Englanninkielisiä ohjeita löytyy mm. OpenMapTilesin ja Mapboxin sivuilta.
Lisää teoriaa löytyy kandidaatintutkielmastani: Vektoritiilet
Tämän ohjeen avulla haet OpenStreetMapista aineistoa, joista luot vektoritiiliaineiston ja teet mieleisesi tyylin. Suosittelen käyttämään jotain muuta kuin Windows-konetta.
Jos löydät tästä ohjeesta joitain virheitä, tai haluat jatkokehittää tätä, voit luoda issuen, tai forkata ja tehdä pull requestin.
Ensimmäisenä tarvitsemme paikkatietoa. OpenStreetMapista löytyy todella paljon aineistoa, jota ei löydy esim Googlen kartoista. Esimerkiksi OSM:stä löytyy tieto siitä missä on pyöräparkkeja. Haetaan siis overpassin avulla kaikki Helsingin pyöräparkit.
1.1 Hae overpass-turbo työkalulla dataa GeoJSONina
- Zoomaa sille alueelle josta haluat dataa
- Valitse ylävalikosta wizard ja kirjoita kenttään
amenity=bicycle_parkingja klikkaa build and run query. - Valitse ylävalikosta export ja download as GeoJSON
- Voit ladata myös muita tasoja karttaasi, esimerkiksi baarit:
amenity=bartai leikkipaikatleisure=playground. Voit myös itse tutkia OpenSreetMapia ja keksiä mitä aineistoa haluaisit käyttää. Overpass-turbo ei ole hyvä työkalu isojen aineistojen hakemiseen. Jos haluat hakea esimerkiksi kaikki Helsingin tiet, tutustu Overpass-API:iin (vaatii ohjelmointitaitoa).
Helpoin tapa esittää GeoJSONia selaimessa on käyttää kartanpiirtokirjastoa, kuten Leafletia tai Openlayersia. Nyt haluamme kuitenkin tehdä nimenomaan vektoritiiliä. Tähän on olemassa mm. Mapboxin kehittämiä työkaluja. Mapbox tarjoaa kirjaston, geojson-vt, joka pilkkoo GeoJSONia vektoritiiliksi lennossa. Toinen hyödyllinen työkalu on myös Mapboxin tippecanoe, joka generoi mbtiles-tiilikokoelmia GeoJSONista.
Asenna tippecanoe näillä ohjeilla.
Tippecanoen asentamisen jälkeen siirry komentorivillä hakemistoon, johon tallensit GeoJSONin ja luo tiilet komennolla:
tippecanoe -o ppparkki.mbtiles export.geojson
ppparkki.mbtiles on tiedosto, johon haluan lopputuloksen tulevan. Sen nimi voi olla mitä vain. export.geojson on overpassista lataamani aineisto. Jos kaikki meni hyvin, samaan kansioon pitäisi olla generoitunut ppparkki.mbtiles -niminen tiedosto.
Jos generoit enemmän kuin yhden GeoJSONin, voit vain laittaa tiedostot peräkkäin tähän tapaan:
tippecanoe -o baaripyora.mbtiles ppparkki.geojson baarit.geojson
jolloin GeoJSONit tulevat mbtiles-tiedostoon erillisinä tasoina.
Nyt haluamme tarkastella mbtiles-tiedoston sisältöä selaimessa. Jos sinulla sattuu olemaan docker asennettuna, helpointa on ajaa .mbtiles-tiedoston sisältävässä hakemistossa komento:
docker run -it -v $(pwd):/data -p 8080:80 klokantech/tileserver-gl
Dockerin käynnistämisen jälkeen avaa localhost:8080 ja valitse inspect. Kannattaa kokeilla väännellä karttaa hiiren oikealla painikkeella, koska se on todella tyydyttävää. Jee, vektoritiiliä!
Jos et halua käyttää dockeria, voit kokeilla jotain näistä.
Vektoritiilityyli määritellään piirtäjäkirjaston vaatimalla syntaksilla. Esimerkiksi mapbox-gl -javascriptkirjasto syö json-muotoisen tyylimäärittelyn, jonka dokumentaatiota voi lukea mapbox-gl:n dokumentaatiosivuilta.
Voit kirjoittaa tyylillesi suoraan raakaa jsonia, tai editoida sitä visuaalisella työkalulla, kuten maputinikilla.
Kloonaa tämä repo, tai ota mallia tämän repon index.jsonista ja server.js:stä.
Jos kloonaat, aja ensin
npm install
ja sitten
npm start
Voit hakea tietyltä alueelta aineistot PostgreSQL-tietokantaan ja Mapboxin tai OpenMaptilesin työkaluilla luoda niistä vektoritiiliä, jonka jälkeen sinun pitää asentaa ja käynnistää vektoritiilipalvelin, josta tiilet haetaan. Jos et halua itse ylläpitää palvelinta, voit käyttää Mapboxin tai OpenMapTilesin tarjoilemia valmiita vektoritiilisettejä OpenStreetMap-aineistoille.