const aufgabe1 = () => {
const map = L.map('map').setView([53.0, 14.0], 4)
map.addLayer(new L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
attribution: 'Map data OpenStreetMap contributors',
minZoom: 1,
maxZoom: 18
}))
const levels = [0, 20, 50, 100, 200, 250, 300, 400]
let geojson;
const getColor = population => {
switch (true) {
case population > levels[7]:
return '#800026'
case population > levels[6]:
return '#BD0026'
case population > levels[5]:
return '#E31A1C'
case population > levels[4]:
return '#FC4E2A'
case population > levels[3]:
return '#FD8D3C'
case population > levels[2]:
return '#FEB24C'
case population > levels[1]:
return '#FED976'
case population > levels[0]:
return '#ffdb83'
default:
return '#ffdea1'
}
}
// Add the legend to the map
const legend = L.control({position: 'bottomright'})
legend.onAdd = () => {
const legend = L.DomUtil.create('div', 'info legend')
const labels = []
for (let i = 0; i < levels.length; i++) {
let from = levels[i] + 1
let to = levels[i + 1] + 1
labels.push(' ' + from + (to ? '–' + to : '+'))
}
legend.innerHTML = labels.join('
')
return legend
}
legend.addTo(map)
// Control that shows state info on hover
const info = L.control()
info.onAdd = () => {
info._div = L.DomUtil.create('div', 'info')
info.update()
return info._div
}
info.update = props => {
info._div.innerHTML = '