diff --git a/frontend/app/map/lines/lines.js b/frontend/app/map/lines/lines.js index 0b15ff8e..dfec4dfa 100644 --- a/frontend/app/map/lines/lines.js +++ b/frontend/app/map/lines/lines.js @@ -91,7 +91,7 @@ fm.app.factory("fmMapLines", function(fmUtils, $uibModal, $compile, $timeout, $r var style = { color : '#'+line.colour, weight : line.width, - opacity : 0.7 + opacity : 0.5 }; // Two points that are both outside of the viewport should not be connected, as the piece in between @@ -102,7 +102,9 @@ fm.app.factory("fmMapLines", function(fmUtils, $uibModal, $compile, $timeout, $r if(line.id != null && openLine && line.id == openLine.id) { openLineHighlight.setLatLngs(splitLatLngs).setStyle(Object.assign(style, { - color: '#000000' + weight: Math.round(line.width*2), + color: "#"+fmUtils.makeTextColour(line.colour), + opacity: 1 })); if(!_doNotRerenderPopup) @@ -169,7 +171,6 @@ fm.app.factory("fmMapLines", function(fmUtils, $uibModal, $compile, $timeout, $r pane: "fmHighlightShadowPane", interactive: false }).addTo(map.map); - fmUtils.blurFilter(openLineHighlight, "fmLinesBlur", 4); linesById[line.id].remove(); linesById[line.id].options.pane = "fmHighlightPane"; diff --git a/frontend/app/map/markers/markers.js b/frontend/app/map/markers/markers.js index 7043585c..8f53e6e5 100644 --- a/frontend/app/map/markers/markers.js +++ b/frontend/app/map/markers/markers.js @@ -30,7 +30,9 @@ fm.app.factory("fmMapMarkers", function($uibModal, fmUtils, $compile, $timeout, var markersUi = { _addMarker : function(marker) { if(!markersById[marker.id]) { - markersById[marker.id] = L.marker([ 0, 0 ], { icon: fmUtils.createMarkerIcon(marker.colour, marker.size, marker.symbol)}).addTo(map.markerCluster) + markersById[marker.id] = L.marker([ 0, 0 ], { + icon: fmUtils.createMarkerIcon(marker.colour, marker.size, marker.symbol) + }).addTo(map.markerCluster) .on("click", function(e) { markersUi.showMarkerInfoBox(map.client.markers[marker.id] || marker); }.fmWrapApply($rootScope)) @@ -42,7 +44,8 @@ fm.app.factory("fmMapMarkers", function($uibModal, fmUtils, $compile, $timeout, markersById[marker.id] .setLatLng([ marker.lat, marker.lon ]) - .setIcon(fmUtils.createMarkerIcon(marker.colour, marker.size, marker.symbol, null, openMarker && openMarker.id == marker.id)); + .setIcon(fmUtils.createMarkerIcon(marker.colour, marker.size, marker.symbol, null, openMarker && openMarker.id == marker.id)) + .setOpacity(0.7); if(openMarker && openMarker.id == marker.id) markersUi.showMarkerInfoBox(marker); @@ -90,6 +93,7 @@ fm.app.factory("fmMapMarkers", function($uibModal, fmUtils, $compile, $timeout, markersById[marker.id].remove(); markersById[marker.id].options.pane = "markerPane"; markersById[marker.id].setIcon(fmUtils.createMarkerIcon(marker.colour, marker.size, marker.symbol)); + markersById[marker.id].setOpacity(0.7); markersById[marker.id].addTo(map.map); } }).hide, @@ -99,6 +103,7 @@ fm.app.factory("fmMapMarkers", function($uibModal, fmUtils, $compile, $timeout, markersById[marker.id].remove(); markersById[marker.id].options.pane = "fmHighlightMarkerPane"; markersById[marker.id].setIcon(fmUtils.createMarkerIcon(marker.colour, marker.size, marker.symbol, null, true)); + markersById[marker.id].setOpacity(1); markersById[marker.id].addTo(map.map); }, editMarker: function(marker) { diff --git a/frontend/app/utils/marker-graphic.ejs b/frontend/app/utils/marker-graphic.ejs index 3ba037f5..1132e882 100644 --- a/frontend/app/utils/marker-graphic.ejs +++ b/frontend/app/utils/marker-graphic.ejs @@ -1,25 +1,7 @@ -<% - if(highlight) { -%> - - - - - -<% - } -%> -<% - if(highlight) { -%> - -<% - } -%> - + <% if(symbol && fmIcons[symbol]) { %> diff --git a/frontend/app/utils/utils.js b/frontend/app/utils/utils.js index 9eea1557..d8a89fa1 100644 --- a/frontend/app/utils/utils.js +++ b/frontend/app/utils/utils.js @@ -75,39 +75,6 @@ fm.app.factory("fmUtils", function($parse, fmIcons) { }); }; - fmUtils.blurFilter = function(layer, filterId, stdDeviation) { - if(layer instanceof L.LayerGroup) { - layer.eachLayer((layer) => { - if(layer instanceof L.Path || layer instanceof L.LayerGroup) - fmUtils.blurFilter(layer, filterId, stdDeviation); - }); - return; - } - - if(!layer._map) { - layer.once("add", () => { - fmUtils.blurFilter(layer, filterId, stdDeviation); - }); - return; - } - - let svg = $(layer.getPane()).find("> svg"); - if(svg.length == 0) - throw new Error(`SVG for pane ${layer.getPane()} could not be found.`); - - if(svg.find("filter").filter(function() { return $(this).attr("id") == filterId; }).length == 0) { - // http://stackoverflow.com/a/28237435/242365 - let blurFilter = document.createElementNS('http://www.w3.org/2000/svg', 'filter'); - blurFilter.setAttribute("id", filterId); - let blurFilterBlur = document.createElementNS('http://www.w3.org/2000/svg', 'feGaussianBlur'); - blurFilterBlur.setAttribute("stdDeviation", stdDeviation); - blurFilter.appendChild(blurFilterBlur); - svg.append(blurFilter); - } - - layer._path.style.filter = `url(#${filterId})`; - }; - fmUtils.makeTextColour = function(backgroundColour, threshold) { if(threshold == null) threshold = 0.5;