From 3d762b58f67489d9a93d56a8f340c5cf1a81fccb Mon Sep 17 00:00:00 2001
From: Bryan Housel <bryan@mapbox.com>
Date: Wed, 26 Apr 2017 02:08:54 -0400
Subject: [PATCH] Add an ellipse to resolve point ambiguity when dragging
 (closes #3536)

---
 css/20_map.css        | 9 +++++++++
 modules/svg/points.js | 7 +++++++
 2 files changed, 16 insertions(+)

diff --git a/css/20_map.css b/css/20_map.css
index 2fe35369b..931d2625c 100644
--- a/css/20_map.css
+++ b/css/20_map.css
@@ -49,6 +49,15 @@ g.point.active, g.point.active * {
     pointer-events: none;
 }
 
+g.point ellipse.stroke {
+    display: none;
+}
+
+.mode-drag-node g.point.active ellipse.stroke {
+    display: block;
+}
+
+
 /* vertices and midpoints */
 
 g.vertex .fill {
diff --git a/modules/svg/points.js b/modules/svg/points.js
index 26261111c..809d4be95 100644
--- a/modules/svg/points.js
+++ b/modules/svg/points.js
@@ -43,6 +43,13 @@ export function svgPoints(projection, context) {
         enter.append('path')
             .call(markerPath, 'shadow');
 
+        enter.append('ellipse')
+            .attr('cx', 0.5)
+            .attr('cy', 1)
+            .attr('rx', 6.5)
+            .attr('ry', 3)
+            .attr('class', 'stroke');
+
         enter.append('path')
             .call(markerPath, 'stroke');