diff --git a/css/style.css b/css/style.css
index 1da34e4..6ca521e 100644
--- a/css/style.css
+++ b/css/style.css
@@ -54,15 +54,23 @@ table.dataTable {
vertical-align: top;
}
-.overpass-layer-icon i {
+.overpass-layer-icon .sign > * {
position: absolute;
top: -34px;
- color: white;
margin: auto;
display: inline-block;
font-size: 11px;
}
+.overpass-layer-icon .icon-white {
+ color: white;
+}
+
+.overpass-layer-icon .icon-invert {
+ -webkit-filter: invert(1);
+ filter: invert(1);
+}
+
/* wrap toolbar controls */
.leaflet-top.leaflet-left {
bottom: 0;
diff --git a/js/LayersConfig.js b/js/LayersConfig.js
index d7b55d8..0921e62 100644
--- a/js/LayersConfig.js
+++ b/js/LayersConfig.js
@@ -183,7 +183,13 @@ BR.LayersConfig = L.Class.extend({
}
},
- createOverpassLayer: function (query) {
+ createOverpassLayer: function (query, icon) {
+ let markerSign = '';
+
+ if (icon && icon.startsWith('maki-')) {
+ markerSign = `
`;
+ }
+
return Object.assign(
new OverpassLayer({
overpassFrontend: this.overpassFrontend,
@@ -195,7 +201,7 @@ BR.LayersConfig = L.Class.extend({
'
',
markerSymbol:
'',
- markerSign: '',
+ markerSign,
style: function (overpassObject) {
return {
nodeFeature: 'Marker',
@@ -294,7 +300,7 @@ BR.LayersConfig = L.Class.extend({
layer.subdomains = props.subdomains;
}
} else if (props.dataSource === 'OverpassAPI') {
- layer = this.createOverpassLayer(props.query);
+ layer = this.createOverpassLayer(props.query, props.icon);
} else {
// JOSM
var josmUrl = url;
diff --git a/package.json b/package.json
index 1aa33dd..d72243f 100644
--- a/package.json
+++ b/package.json
@@ -36,6 +36,7 @@
],
"dependencies": {
"@bagage/leaflet.restoreview": "1.0.1",
+ "@mapbox/maki": "^6.2.0",
"@mapbox/polyline": "^0.2.0",
"@mapbox/togeojson": "^0.16.0",
"@turf/turf": "^6.2.0",
@@ -283,6 +284,36 @@
"main": [
"dist/overpass-layer.js"
]
+ },
+ "@mapbox/maki": {
+ "main": [
+ "icons/art-gallery-11.svg",
+ "icons/bakery-11.svg",
+ "icons/bank-11.svg",
+ "icons/bar-11.svg",
+ "icons/bbq-11.svg",
+ "icons/beer-11.svg",
+ "icons/bicycle-11.svg",
+ "icons/cafe-11.svg",
+ "icons/campsite-11.svg",
+ "icons/car-11.svg",
+ "icons/car-rental-11.svg",
+ "icons/drinking-water-11.svg",
+ "icons/entrance-alt1-11.svg",
+ "icons/fast-food-11.svg",
+ "icons/fuel-11.svg",
+ "icons/grocery-11.svg",
+ "icons/hospital-11.svg",
+ "icons/information-11.svg",
+ "icons/lodging-11.svg",
+ "icons/picnic-site-11.svg",
+ "icons/restaurant-11.svg",
+ "icons/shelter-11.svg",
+ "icons/shop-11.svg",
+ "icons/star-11.svg",
+ "icons/toilet-11.svg",
+ "icons/water-11.svg"
+ ]
}
}
}
diff --git a/yarn.lock b/yarn.lock
index 94d9675..009c60b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -901,6 +901,11 @@
minimist "1.2.0"
sharkdown "^0.1.0"
+"@mapbox/maki@^6.2.0":
+ version "6.2.0"
+ resolved "https://registry.yarnpkg.com/@mapbox/maki/-/maki-6.2.0.tgz#b61b3e8e7fc7637493e511ac40de0eea62cd1f8b"
+ integrity sha512-iFIRNT3ZpTOw69p2BFFOmQppujpav2PQTLPyL4+bZ5ZIUfdyB5Qtw45CTfPqzzHpP2AZGjEDbSNhGDRcG9/2fw==
+
"@mapbox/polyline@^0.2.0":
version "0.2.0"
resolved "https://registry.yarnpkg.com/@mapbox/polyline/-/polyline-0.2.0.tgz#6e25980744aa22331f94b645a542c02d3fcfee97"