From 4b5260a5abdafb9f2cd47897fa28a8b78a7146ff Mon Sep 17 00:00:00 2001
From: Bryan Housel <bryan@mapbox.com>
Date: Mon, 11 Dec 2017 15:48:08 -0500
Subject: [PATCH] Add wireframe viewfield marker (styling marker fill in svg is
 not currently supported)

---
 modules/svg/defs.js     | 18 ++++++++++++++++++
 modules/svg/vertices.js |  3 ++-
 2 files changed, 20 insertions(+), 1 deletion(-)

diff --git a/modules/svg/defs.js b/modules/svg/defs.js
index 6f4353769..65f37a7ba 100644
--- a/modules/svg/defs.js
+++ b/modules/svg/defs.js
@@ -63,6 +63,24 @@ export function svgDefs(context) {
             .attr('stroke-width', '0.5px')
             .attr('stroke-opacity', '0.75');
 
+        defs
+            .append('marker')
+            .attr('id', 'viewfield-marker-wireframe')
+            .attr('viewBox', '0 0 16 16')
+            .attr('refX', 8)
+            .attr('refY', 16)
+            .attr('markerWidth', 4)
+            .attr('markerHeight', 4)
+            .attr('markerUnits', 'strokeWidth')
+            .attr('orient', 'auto')
+            .append('path')
+            .attr('class', 'viewfield')
+            .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')
+            .attr('stroke-width', '0.5px')
+            .attr('stroke-opacity', '0.75');
+
         // patterns
         var patterns = defs.selectAll('pattern')
             .data([
diff --git a/modules/svg/vertices.js b/modules/svg/vertices.js
index e7fa7a776..c0425154c 100644
--- a/modules/svg/vertices.js
+++ b/modules/svg/vertices.js
@@ -59,6 +59,7 @@ export function svgVertices(projection, context) {
         siblings = siblings || {};
         var icons = {};
         var directions = {};
+        var wireframe = context.surface().classed('fill-wireframe');
         var z = (zoom < 17 ? 0 : zoom < 18 ? 1 : 2);
 
 
@@ -197,8 +198,8 @@ export function svgVertices(projection, context) {
             .append('path')
             .attr('class', 'viewfield')
             .attr('d', 'M0,0H0')
-            .attr('marker-start', 'url(#viewfield-marker)')
             .merge(viewfields)
+            .attr('marker-start', 'url(#viewfield-marker' + (wireframe ? '-wireframe' : '') + ')')
             .attr('transform', function(d) { return 'rotate(' + d + ')'; });
     }