From b0cba113e9dcbe13e21c4ca8c824bb5f573f7035 Mon Sep 17 00:00:00 2001
From: Bryan Housel <bryan@mapbox.com>
Date: Fri, 19 Jan 2018 20:32:45 +0000
Subject: [PATCH] Fix directional vertices on IE11/Edge (closes #4710)

---
 css/20_map.css      | 14 +++++++++++++-
 modules/svg/defs.js |  6 +++---
 2 files changed, 16 insertions(+), 4 deletions(-)

diff --git a/css/20_map.css b/css/20_map.css
index f5d8e168a..e02a3922b 100644
--- a/css/20_map.css
+++ b/css/20_map.css
@@ -1,5 +1,17 @@
 /* base styles */
-.layer-osm path:not(.oneway) { fill: none; }     /* IE needs :not(.oneway) */
+.layer-osm path:not(.oneway-marker-path) {                /* IE/Edge needs :not(.oneway) */
+    fill: none; 
+}
+.layer-osm path.viewfield-marker-path {                   /* IE/Edge rule for <use> marker style */
+    fill: #333;
+    fill-opacity: 0.75;
+    stroke: #fff;
+    stroke-width: 0.5px;
+    stroke-opacity: 0.75;
+}
+.fill-wireframe .layer-osm path.viewfield-marker-path {   /* IE/Edge rule for <use> marker style */
+    fill: none;
+}
 
 /* the above fill: none rule affects paths in <use> shadow dom only in Firefox */
 .layer-osm use.icon path { fill: #333; }                       /* FF svg Maki icons */
diff --git a/modules/svg/defs.js b/modules/svg/defs.js
index ff6e2209e..d3e533ca4 100644
--- a/modules/svg/defs.js
+++ b/modules/svg/defs.js
@@ -38,7 +38,7 @@ export function svgDefs(context) {
             .attr('markerUnits', 'strokeWidth')
             .attr('orient', 'auto')
             .append('path')
-            .attr('class', 'oneway')
+            .attr('class', 'oneway-marker-path')
             .attr('d', 'M 5,3 L 0,3 L 0,2 L 5,2 L 5,0 L 10,2.5 L 5,5 z')
             .attr('stroke', 'none')
             .attr('fill', '#000')
@@ -55,7 +55,7 @@ export function svgDefs(context) {
             .attr('markerUnits', 'strokeWidth')
             .attr('orient', 'auto')
             .append('path')
-            .attr('class', 'viewfield')
+            .attr('class', 'viewfield-marker-path')
             .attr('d', 'M 6,14 C 8,13.4 8,13.4 10,14 L 16,3 C 12,0 4,0 0,3 z')
             .attr('fill', '#333')
             .attr('fill-opacity', '0.75')
@@ -74,7 +74,7 @@ export function svgDefs(context) {
             .attr('markerUnits', 'strokeWidth')
             .attr('orient', 'auto')
             .append('path')
-            .attr('class', 'viewfield')
+            .attr('class', 'viewfield-marker-path')
             .attr('d', 'M 6,14 C 8,13.4 8,13.4 10,14 L 16,3 C 12,0 4,0 0,3 z')
             .attr('fill', 'none')
             .attr('stroke', '#fff')