" + data[i].name.replace(''', "'") + "
" + - (data[i].hasOwnProperty('lastvisit') ? "Last visited " + data[i].lastvisit + "
" : "Never visited
") + + "diff --git a/people/static/js/map.js b/people/static/js/map.js index 5295456..78eda6a 100644 --- a/people/static/js/map.js +++ b/people/static/js/map.js @@ -1,14 +1,6 @@ -const marker_main_alpha_never = 1.0; -const marker_main_alpha_future = 1.0; -const marker_main_alpha = 1.0; - -const marker_main_colour_never = 'grey'; -const marker_main_colour_future = 'white'; - +const marker_fill_alpha = 1.0; const marker_edge_colour = 'white'; -const marker_edge_colour_never = 'white'; -const marker_edge_colour_future = 'black'; - +const marker_fill_colour = 'gray'; // Size of the arrow markers used on the map const marker_scale = 9; @@ -22,22 +14,6 @@ const settings = { zoom: 5 } -// const data = [ -// {lat: 0, lng: 0, name: 'a'}, -// {lat: 1, lng: 1, name: 'b'}, -// {lat: 2, lng: 2, name: 'c'}, -// ] - - - -// Pull settings from the settings var -// const time_after = filters.time_after; -// const time_before = filters.time_before; -// Set up a colour scale that goes from blue to red via yellow, over time_limit days -// const visitedColour = d3.scaleSequential(d3.interpolateRdYlBu) -// .domain([filters.time_after, filters.time_before]); - - // The function called when Google Maps starts up function initMap() { const centre_latlng = new google.maps.LatLng(0, 0); @@ -46,31 +22,30 @@ function initMap() { document.getElementById('map'), { zoom: settings.zoom, center: centre_latlng }); // For each data entry in the json... - for (var i = 0; i < data.length; i++) { + for (const pin_data of data) { // Get the lat-long position from the data - var lat_lng = new google.maps.LatLng(data[i].lat, data[i].lng); + const lat_lng = new google.maps.LatLng(pin_data.lat, pin_data.lng); // Generate a new marker - var marker = new google.maps.Marker({ - position: lat_lng, map: map, + const marker = new google.maps.Marker({ + position: lat_lng, + map: map, icon: { path: google.maps.SymbolPath.BACKWARD_CLOSED_ARROW, - strokeColor: edgeColourByTime(data[i]), + strokeColor: marker_edge_colour, strokeWeight: marker_edge_width, strokeOpacity: marker_edge_alpha, - fillColor: mainColourByTime(data[i]), - fillOpacity: alphaByTime(data[i]), + fillColor: marker_fill_colour, + fillOpacity: marker_fill_alpha, scale: marker_scale, labelOrigin: new google.maps.Point(0, -marker_label_offset) }, - label: (data[i].type === 'school' ? '🎓' : '') }); // Build the info window content to tell the user the last time it was visited. marker.info = new google.maps.InfoWindow({ content: "
Last visited " + data[i].lastvisit + "
" : "Never visited
") + + "