OpenStreetMap-tiedoston lukeminen ja muokkaaminen selainympäristössä

Abstract

Työn tilaajana oli Magister Solutions. Magister Solutions on Jyväskylässä sijaitseva ohjelmistoyritys, jonka toiminta keskittyy telekommunikaatioratkaisuihin. Magister Solutions toimii myös kansainvälisillä markkinoilla.

Työn tavoitteena oli toteuttaa verkkoselaimessa toimiva ohjelma, jolla pystyy muokkaamaan OpenStreetMapista vietyä karttatietoa. Karttatieto annetaan ohjelmalle OpenStreetMapin käyttämässä OSM XML -formaatissa. Ohjelman täytyisi parsia sille annettu tiedosto ja muokata tiedostosta saatua dataa piirrettävään muotoon. Käyttäjän täytyisi pystyä muokkaamaan piirrettyä tietoa editointityökalulla. Työssä keskityttiin teiden käsittelyyn ja muokkaamiseen.

Työn kannalta tärkeimmät aiheet ovat web-ohjelmoinnin perusteet, XML-metakieli, OSM XML -formaatti ja SVG-vektorigrafiikka. Lisäksi työssä käsitellään uuden projektin luominen käyttämällä Angular-ohjelmistokehystä.

Työtä lähdettiin kehittämään ennalta toteutetun tietorakenteen päälle. Ensin toteutettiin OSM XML -tiedoston lukeminen ja käsittely. Tiedostosta saadulle tiedolle tehtiin tarvittavat koordinaattimuunnokset, jonka jälkeen tieto lisättiin tietokantaan. Tiet piirrettiin käyttämällä SVG-vektorigrafiikkaa tietokannasta saadun tiedon perusteella. Lopuksi toteutettiin metodit teiden valitsemiselle ja poistamiselle.

Lopputuloksena on verkkoselaimessa toimiva ohjelma, jota käyttämällä pystyy rajoitetusti muokkaamaan OpenStreetMapin karttatietoa. Tiet piirtyvät oikein ja valitut tiet pystytään poistamaan sekä ohjelmasta että tietokannasta.

This thesis was ordered by Magister Solutions. Magister Solutions is a software company locat-ed in Jyväskylä. Magister Solutions’ main expertise is telecommunication solutions and they work also world-wide.

The goal of the thesis was to develop a web program for editing map data exported from OpenStreetMap. Map data is given to the program in OSM XML format which is used by OpenStreetMap. The given file would be parsed and edited to the format that can be drawn. The user should be able to edit the drawn data by using the editing tool. Handling and editing the roads were the focus of the thesis.

Most important topics for the thesis were the basics of web programming, XML metalanguage, OSM XML format and SVG vector graphics. Thesis will also go through how to start up a new project by using Angular software framework.

Before-made data structure was used as a base of the program. The first task was to create a way to read and handle the OSM XML file. The data had to go through coordinate transforms before adding to the data structure. The data of the data structure was used to display the roads with SVG vector graphics. The last task was to create methods to select and delete roads.

The result was a web program which has limited features for editing OpenStreetMap map data. Roads are displayed correctly, and selected roads are deleted both from the program and from the data structure.