https://tienskip.nl/js/map.js

1$(function () {
2
3
4
5  // only if #map exists
6  if ($('#map').length === 0) {
7    return;
8  } else {
9    let mapdata = {};
10
11    fetch('/api/events/map')
12      .then(response => response.json())
13      .then(data => {
14        //console.log(data);
15        mapData = data;
16      })
17      .catch(error => {
18        console.error('Error:', error);
19      });
20
21    function getStateInfo(state) {
22
23      //return filteredData.events;
24    }
25
26    var jsMap = $('#map');
27
28    $('#map').JSMaps({
29      map: 'netherlands', //Use any map as named in the maps folder e.g. usa
30      mapWidth: 300,
31      onStateClick: function (e) {
32
33        const { provinces } = mapData;
34
35        const filteredData = provinces.find(provinceObj => provinceObj.province === e.name);
36
37        console.log(e.name);
38        $('.jsmaps-text').html(filteredData.events);
39      }
40    });
41  }
42
43  // function redraw() {
44  //   jsMap.trigger('reDraw', {
45  //     paths: window.JSMaps.maps.netherlands.paths.map(path => {
46  //       return {
47  //         ...path,
48  //       }
49  //     })
50  //   })
51  // }
52});