title: Add Polyline on click and show next point on mouse cursor
body: <p>Not sure how to word my question in the title, but what I want to do is have a feature that behaves the same as the Your Places -> Maps -> Create Map on maps.google.com when you click the "Draw a Line" -> "Add Line or Shape" button. It starts a Polyline on the map and then shows a shadow line from that points to your mouse cursor so you can see what your line will be when you click again:</p>
  
  <p><a href="https://i.stack.imgur.com/GKq4f.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/GKq4f.png" alt="enter image description here"></a></p>
  
  <p>Is there a built-in options in the Google Maps API to do this? I have this much so far when a user clicks the map for the first time:</p>
  
  <pre><code>function startNewLine(latLng) {
    var line = new google.maps.Polyline({
      draggable: true,
      editable: true,
    });
  
    line.setMap(boundaryMap);
    line.getPath().push(latLng);
  
    google.maps.event.clearListeners(boundaryMap, 'click');
  }
  </code></pre>
  
  <p><a href="https://jsfiddle.net/4vg5pfgv/" rel="nofollow noreferrer">Fiddle</a></p>
  
  <p>It starts a new line at the point that was clicked, but that's as far as I've gotten.</p>