diff --git a/css/20_map.css b/css/20_map.css index e02a3922b..29fa82a7b 100644 --- a/css/20_map.css +++ b/css/20_map.css @@ -214,6 +214,7 @@ text.pointlabel { dominant-baseline: auto; } +text.gpxlabel-halo, .layer-labels-halo text { opacity: 0.7; stroke: #fff; @@ -271,6 +272,13 @@ path.gpx { fill: none; } -text.gpx { +text.gpxlabel { fill: #ff26d4; } + +text.gpxlabel-halo, +text.gpxlabel { + font-size: 12px; + font-weight: bold; + dominant-baseline: middle; +} \ No newline at end of file diff --git a/modules/svg/gpx.js b/modules/svg/gpx.js index f1274203c..931189aa2 100644 --- a/modules/svg/gpx.js +++ b/modules/svg/gpx.js @@ -57,7 +57,6 @@ export function svgGpx(projection, context, dispatch) { svgGpx.initialized = true; } - function drawGpx(selection) { var geojson = svgGpx.geojson, enabled = svgGpx.enabled; @@ -93,16 +92,26 @@ export function svgGpx(projection, context, dispatch) { .attr('d', path); - var labels = layer.selectAll('text') - .data(showLabels && geojson.features ? geojson.features : []); - - labels.exit() - .remove(); - - labels = labels.enter() - .append('text') - .attr('class', 'gpx') - .merge(labels); + function createLabels(layer, textClass, data) { + var labels = layer.selectAll('text.' + textClass) + .data(data); + + labels.exit() + .remove(); + + labels = labels.enter() + .append('text') + .attr('class', textClass) + .merge(labels); + + return labels; + } + + var labelsData = showLabels && geojson.features ? geojson.features : []; + createLabels(layer, 'gpxlabel-halo', labelsData); + createLabels(layer, 'gpxlabel', labelsData); + + var labels = layer.selectAll('text'); labels .text(function(d) { @@ -110,7 +119,7 @@ export function svgGpx(projection, context, dispatch) { }) .attr('x', function(d) { var centroid = path.centroid(d); - return centroid[0] + 7; + return centroid[0] + 11; }) .attr('y', function(d) { var centroid = path.centroid(d);