diff --git a/app/Http/Controllers/NotesController.php b/app/Http/Controllers/NotesController.php
index d576de0e..1242ee81 100644
--- a/app/Http/Controllers/NotesController.php
+++ b/app/Http/Controllers/NotesController.php
@@ -356,15 +356,18 @@ class NotesController extends Controller
         $icon = $icon ?? 'marker';
 
         return '{
-            "type": "Feature",
-            "geometry": {
-                "type": "Point",
-                "coordinates": [' . $longitude . ', ' . $latitude . ']
-            },
-            "properties": {
-                "title": "' . $title . '",
-                "icon": "' . $icon . '"
-            }
+            "type": "FeatureCollection",
+            "features": [{
+                "type": "Feature",
+                "geometry": {
+                    "type": "Point",
+                    "coordinates": [' . $longitude . ', ' . $latitude . ']
+                },
+                "properties": {
+                    "title": "' . $title . '",
+                    "icon": "' . $icon . '"
+                }
+            }]
         }';
     }
 }
diff --git a/resources/assets/es6/mapbox-utils.js b/resources/assets/es6/mapbox-utils.js
index ba84c8d6..d700da96 100644
--- a/resources/assets/es6/mapbox-utils.js
+++ b/resources/assets/es6/mapbox-utils.js
@@ -41,8 +41,7 @@ const makeMapMenu = (map) => {
 export default function addMap(div, position = null, places = null) {
     let dataLatitude = div.dataset.latitude;
     let dataLongitude = div.dataset.longitude;
-    let dataId = div.dataset.id;
-    let data = window['geojson'+dataId];
+    let data = window['geojson'+div.dataset.id];
     if (data == null) {
         data = {
             'type': 'FeatureCollection',
@@ -94,15 +93,13 @@ export default function addMap(div, position = null, places = null) {
     map.addControl(new mapboxgl.NavigationControl());
     div.appendChild(makeMapMenu(map));
     map.on('load', function () {
-        map.addSource('points', {
-            'type': 'geojson',
-            'data': data
-        });
         map.addLayer({
             'id': 'points',
-            'interactive': true,
             'type': 'symbol',
-            'source': 'points',
+            'source': {
+                'type': 'geojson',
+                'data': data
+            },
             'layout': {
                 'icon-image': '{icon}-15',
                 'text-field': '{title}',
diff --git a/resources/assets/es6/maps.js b/resources/assets/es6/maps.js
index abf60ae0..d7721f91 100644
--- a/resources/assets/es6/maps.js
+++ b/resources/assets/es6/maps.js
@@ -1,8 +1,8 @@
 //maps.js
-import addMapTo from './mapbox-utils';
+import addMap from './mapbox-utils';
 
 let mapDivs = document.querySelectorAll('.map');
 
 for (var div of mapDivs) {
-    addMapTo(div);
+    addMap(div);
 }
diff --git a/webpack.config.js b/webpack.config.js
index 3cc7b616..962ba4e9 100644
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -15,6 +15,7 @@ const config = {
   },
   devtool: 'source-map',
   module: {
+    noParse: [/(mapbox-gl)\.js$/],
     loaders: [
       {
         test: /\.js$/,