diff --git a/css/60_mapillary.css b/css/60_mapillary.css index a248a1ac2..2910342e1 100644 --- a/css/60_mapillary.css +++ b/css/60_mapillary.css @@ -66,3 +66,15 @@ z-index: 80; } + +/* Mapillary viewer */ +#mly .domRenderer .TagSymbol { + font-size: 12px; + background-color: rgba(0, 0, 0, 0.4); + padding: 0 4px; + border-radius: 4px; + transform: translate(-50%, -120%) !important; +} + + + diff --git a/modules/services/mapillary.js b/modules/services/mapillary.js index d0dec62f1..846e0504e 100644 --- a/modules/services/mapillary.js +++ b/modules/services/mapillary.js @@ -523,7 +523,12 @@ export default { function makeTag(data) { + var valueParts = data.properties.value.split('--'); + if (valueParts.length !== 3) return; + + var text = valueParts[1].replace(/-/g, ' '); var tag; + // Currently only two shapes if (data.properties.shape.type === 'Polygon') { var polygonGeometry = new Mapillary @@ -534,7 +539,12 @@ export default { data.properties.key, polygonGeometry, { - text: data.properties.value + text: text, + textColor: 0xffff00, + lineColor: 0xffff00, + lineWidth: 2, + fillColor: 0xffff00, + fillOpacity: 0.3, } ); @@ -547,7 +557,9 @@ export default { data.properties.key, pointGeometry, { - text: data.properties.value + text: text, + color: 0xffff00, + textColor: 0xffff00 } ); }