jonny/jonnybarnes.uk
1
0
Fork 0
Code Issues 8 Pull requests Projects Releases 5 Packages Wiki Activity Actions

allow multiple maps to be added on a page

Browse source
This commit is contained in:
Jonny Barnes 2017-01-26 19:51:11 +00:00
parent 264078d058
commit 6cbe62bad2
3 changed files with 82 additions and 87 deletions
Download patch file Download diff file Expand all files Collapse all files

13
resources/assets/es6/mapbox-utils.js
View file

@ -38,11 +38,7 @@ const makeMapMenu = (map) => {
} }
//the main function //the main function
export default function addMap(position = null, places = null) { export default function addMap(div, position = null, places = null) {
//console.log(position);
//console.log(places);
let mapDivs = document.querySelectorAll('.map');
for (let div of mapDivs) {
let dataLatitude = div.dataset.latitude; let dataLatitude = div.dataset.latitude;
let dataLongitude = div.dataset.longitude; let dataLongitude = div.dataset.longitude;
let dataId = div.dataset.id; let dataId = div.dataset.id;
@ -82,10 +78,8 @@ export default function addMap(position = null, places = null) {
}); });
} }
} }
if (! dataLongitude) { if (position != null) {
let dataLongitude = position.coords.longitude; let dataLongitude = position.coords.longitude;
}
if (! dataLatitude) {
let dataLatitude = position.coords.latitude; let dataLatitude = position.coords.latitude;
} }
let map = new mapboxgl.Map({ let map = new mapboxgl.Map({
@ -116,6 +110,7 @@ export default function addMap(position = null, places = null) {
} }
}); });
}); });
if (position != null) {
map.on('click', function (e) { map.on('click', function (e) {
let features = map.queryRenderedFeatures(e.point, { let features = map.queryRenderedFeatures(e.point, {
layer: ['points'] layer: ['points']
@ -128,6 +123,7 @@ export default function addMap(position = null, places = null) {
selectPlaceInForm(features[0].properties.uri); selectPlaceInForm(features[0].properties.uri);
} }
}); });
}
if (data.features && data.features.length > 1) { if (data.features && data.features.length > 1) {
let bounds = new mapboxgl.LngLatBounds(); let bounds = new mapboxgl.LngLatBounds();
for (let feature of data.features) { for (let feature of data.features) {
@ -138,4 +134,3 @@ export default function addMap(position = null, places = null) {
return map; return map;
} }
}

4
resources/assets/es6/nearby-places.js
View file

@ -45,7 +45,7 @@ const makeOptionsForForm = (map, position, places = null) => {
} }
//position is output of navigator.geolocation call //position is output of navigator.geolocation call
export default function addMapWithPlaces(position) { export default function addMapWithPlaces(div, position) {
fetch('/places/near/' + position.coords.latitude + '/' + position.coords.longitude + '?u=' + position.coords.accuracy, { fetch('/places/near/' + position.coords.latitude + '/' + position.coords.longitude + '?u=' + position.coords.accuracy, {
credentials: 'same-origin', credentials: 'same-origin',
method: 'get' method: 'get'
@ -65,7 +65,7 @@ export default function addMapWithPlaces(position) {
if (json.places.length > 0) { if (json.places.length > 0) {
places = json.places; places = json.places;
} }
let map = addMap(position, places); let map = addMap(div, position, places);
//create a containting div for flexbox styling purposes //create a containting div for flexbox styling purposes
let flexboxDiv = document.createElement('div'); let flexboxDiv = document.createElement('div');
let options = makeOptionsForForm(map, position, places); let options = makeOptionsForForm(map, position, places);

2
resources/assets/es6/newnote-getlocation.js
View file

@ -11,6 +11,6 @@ export default function getLocation() {
mapDiv.dataset.latitude = position.coords.latitude; mapDiv.dataset.latitude = position.coords.latitude;
mapDiv.dataset.longitude = position.coords.longitude; mapDiv.dataset.longitude = position.coords.longitude;
mapDiv.dataset.accuracy = position.coords.accuracy; mapDiv.dataset.accuracy = position.coords.accuracy;
addMapWithPlaces(position); addMapWithPlaces(mapDiv, position);
}); });
} }