Workshops.This-Way

Making a Web Map with Leaflet.js

Leaflet is an open-source JavaScript library for interactive web maps. It’s lightweight, simple, and flexible, and is probably one of the most most popular open-source mapping library at the moment.

In Part one we will set up the basics to show a standard background map with Leaflet.

In Part two we will add markers, circles and polygons to our map.

In Part three we will change the projection to RDNew(EPSG:28992) and add a WMS service from the CBS.

In Part four we will set up a local server and add a GeoJSON file containing geo-spatial data to our map.

Qgis 1. - Setting up

In deze workshop ga je Qgis op zetten, de instellingen veranderen en een project op starten. Daarna ga je de eerste datasets toe voegen en onderzoeken.

Deze workshop is gemaakt op Qgis versie: 3.14.16-PI

Qgis 2. - Data analyse

Deze workshop neemt je mee om de eerste stappen te zetten in het rekenen met geodata. We gaan kijken hoe we nieuwe data kunnen genereren door selecties te maken, datasets te koppelen en kleine berekeningen te doen. Deze workshop gaat er vanuit dat je de workshop Qgis 1. - Setting up hebt voltooid.

Deze workshop is gemaakt op Qgis versie: 3.14.16-PI

Qgis 3. - Maak je eigen data

In deze workshop leer je hoe je een eigen dataset kan aanmaken en bewerken.

Deze workshop gaat er van uit dat je de workshop Qgis 2. - Data analyse hebt voltooid en gaat verder waar dez is gestopt.

Deze workshop is gemaakt op Qgis versie: 3.14.16-PI

Qgis 4. - Data van het web

Deze workshop gaat er vanuit dat je de workshop Qgis 1. - Setting up hebt voltooid. Deze workshop is gemaakt op Qgis versie: 3.14.16-PI Voorbereiding Hoe werkt deze workshop? In de workshop vind je links naar externe bronnen. Klik altijd op een link met de rechtermuisknop en kies: Open Link in een nieuw tabblad. Zo raak je nooit de workshop pagina kwijt. Probeer met 2 schermen te werken, zodat je de workshop naast Qgis open kan hebben staan (of gebruik een tablet waarop je de workshop opent).

Qgis 5. - Data visualisatie

Deze workshop gaat er vanuit dat je de workshop Qgis 1. - Setting up hebt voltooid de PDOK plugin hebt geïnstalleerd van workshop Qgis 4 - data van het web Deze workshop is gemaakt op Qgis versie: 3.14.16-PI Voorbereiding Hoe werkt deze workshop? In de workshop vind je links naar externe bronnen. Klik altijd op een link met de rechtermuisknop en kies: Open Link in een nieuw tabblad. Zo raak je nooit de workshop pagina kwijt.

Running a local server

When developing a website, a web designer needs to be able to see his webpages the same way the end user would. Sometimes simply clicking on and viewing your HTML files in the web browser is enough, but if you want to test dynamic content, you will need to set up a local web server. Doing this is quite simple and can easily be accomplished on Windows, Mac, and Linux. There are many types of web servers available, but we will be using the Python’s SimpleHTTPServer as it is very easy to set up.

Making a WebPage

Everything you see in a website is a result of the combination of HTML and CSS. With these two languages, you will have the skills you need to bring your website design to life!