How to make the google maps infowindow show at the mouse position when I hover over the polygon or polyline?
<p>I need to edit the position of <strong>infowindow</strong> so that it shows the position of the <strong>mouse</strong> when I hover over the polygon (the green area) not at the top left corner. How would I do that? </p>

<p>I have tried <code>infowindow.set_positionevent.latLng)</code> but it didn't work and the infowindow didn't show at all.</p>

<pre><code>var infowindow_polygon_1 = new google.maps.InfoWindow({content: '&lt;h1&gt;polygon&lt;/h1&gt;&lt;br/&gt;&lt;a href="http://www.google.com/"&gt;google&lt;/a&gt;"'});
google.maps.event.addListener(flightPath_2,"mouseover",function(){
 this.setOptions({fillColor: "#00FF00"});
  infowindow_polygon_1.setPosition(event.latLng);
    infowindow_polygon_1.open(map);
}); 
</code></pre>

<p><a href="https://i.stack.imgur.com/Cl6xc.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/Cl6xc.png" alt="without edit the position using setposition"></a></p>

<p><div class="snippet" data-lang="js" data-hide="true" data-console="true" data-babel="false">
<div class="snippet-code snippet-currently-hidden">
<pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;h1&gt;My First Google Map&lt;/h1&gt;

&lt;div id="map" style="width:100%;height:500px"&gt;&lt;/div&gt;

&lt;script&gt;
  function myMap() {
    var mapCanvas = document.getElementById("map");
    var mapOptions = {
      center: new google.maps.LatLng(51.508742, -0.120850),
      zoom: 5
    };

    var map = new google.maps.Map(mapCanvas, mapOptions);

    var wellIcon = {
      // url: "well.png", // url
      scaledSize: new google.maps.Size(20, 20), // scaled size
      origin: new google.maps.Point(0, 0), // origin
      anchor: new google.maps.Point(0, 0) // anchor
    };

    var raisaCairo = new google.maps.LatLng(29.957252, 31.275634);
    var libya = new google.maps.LatLng(27.195036247666614, 18.10546875);
    var ireland_1 = new google.maps.LatLng(55.26597215355588, -12.7001953125);
    var ireland_2 = new google.maps.LatLng(55.91165733399104, -5.361328125);
    var ireland_3 = new google.maps.LatLng(50.58253919582843, -10.5029296875);
    var ireland_4 = new google.maps.LatLng(52.33466792329363, -4.5263671875);
    var stavanger = new google.maps.LatLng(58.983991, 5.734863);
    var amsterdam = new google.maps.LatLng(52.395715, 4.888916);
    var london = new google.maps.LatLng(51.508742, -0.120850);
    var sep_1 = new google.maps.LatLng(44.22866952759539, -2.8125);
    var sep_2 = new google.maps.LatLng(42.211431145149, 4.3945312);



    var wellMarker = new google.maps.Marker({
      position: raisaCairo,
      icon: wellIcon
    });
    wellMarker.setMap(map);

    var infowindow_wellMarker = new google.maps.InfoWindow({
      content: "Well"
    });

    google.maps.event.addListener(wellMarker, 'click', function() {
      map.setZoom(6);
      map.setCenter(wellMarker.getPosition());
      infowindow_wellMarker.open(map, wellMarker);
    });
    //////////////////////////////////




    var wellMarker_1 = new google.maps.Marker({
      position: libya,
      icon: wellIcon
    });
    wellMarker_1.setMap(map);

    var infowindow_wellMarker_1 = new google.maps.InfoWindow({
      content: "Well"
    });

    google.maps.event.addListener(wellMarker_1, 'click', function() {
      map.setZoom(6);
      map.setCenter(wellMarker_1.getPosition());
      infowindow_wellMarker_1.open(map, wellMarker_1);
    });



    //////////////////////////////////

    google.maps.event.addListener(wellMarker, 'mouseover', function() {
      infowindow_wellMarker.open(map, wellMarker);
    });
    google.maps.event.addListener(wellMarker, 'mouseout', function() {
      infowindow_wellMarker.close(map, wellMarker);
    });

    google.maps.event.addListener(wellMarker_1, 'mouseover', function() {
      infowindow_wellMarker_1.open(map, wellMarker);
    });
    google.maps.event.addListener(wellMarker_1, 'mouseout', function() {
      infowindow_wellMarker_1.close(map, wellMarker);
    });


    //////////////////////////////////////////////////////////////////////////////
    var flightPath = new google.maps.Polyline({
      path: [stavanger, amsterdam, london],
      strokeColor: "#FF00FF",
      strokeOpacity: 0.5,
      strokeWeight: 5
    });
    flightPath.setMap(map);


    var sep = new google.maps.Polyline({
      path: [sep_1, sep_2],
      strokeColor: "#F0000F",
      strokeOpacity: 1,
      strokeWeight: 10
    });
    sep.setMap(map);
    //////////////////////////////////////////////////////////////////////////////

    var flightPath_2 = new google.maps.Polygon({
      path: [stavanger, amsterdam, raisaCairo],
      strokeColor: "#000000",
      strokeOpacity: 0.4,
      strokeWeight: 5,
      fillColor: "#00FF00",
      fillOpacity: 0.3
    });
    flightPath_2.setMap(map);


    var irland = new google.maps.Polygon({
      path: [ireland_1, ireland_3, ireland_4, ireland_2],
      strokeColor: "#000000",
      strokeOpacity: 0.9,
      strokeWeight: 10,
      fillColor: "#0FFFF0",
      fillOpacity: 0.7
    });

    irland.setMap(map);

    ////////////////////////////////////////////////////////////////////////////////////////
    //event

    var infowindow_polygon_1 = new google.maps.InfoWindow({
      content: '&lt;h1&gt;polygon&lt;/h1&gt;&lt;br/&gt;&lt;a href="http://www.google.com/"&gt;google&lt;/a&gt;"'
    });
    google.maps.event.addListener(flightPath_2, "mouseover", function() {
      this.setOptions({
        fillColor: "#00FF00"
      });

      infowindow_polygon_1.open(map);
      infowindow_polygon_1.setPosition(event.latLng);
    });

    google.maps.event.addListener(flightPath_2, "mouseout", function() {
      this.setOptions({
        fillColor: "#FF0000"
      });
      infowindow_polygon_1.close(map);
    });

    //event
    var infowindow_polygon_2 = new google.maps.InfoWindow({
      content: "&lt;h2&gt;polyline&lt;/h2&gt;"
    });


    google.maps.event.addListener(flightPath, "mouseover", function() {
      this.setOptions({
        strokeColor: "#00FF00"
      });

      infowindow_polygon_2.open(map);
      infowindow_polygon_2.setPosition(event.latLng);
    });

    google.maps.event.addListener(flightPath, "mouseout", function() {
      this.setOptions({
        strokeColor: "#FF0000"
      });
      infowindow_polygon_2.close(map);
    });


    ///on click
    var marker_1 = [];
    var infowindow_1 = [];
    //event 
    function placeMarker(map, location) {
      marker_1 = new google.maps.Marker({
        position: location,
        map: map
      });
      infowindow_1 = new google.maps.InfoWindow({
        content: 'Latitude: ' + location.lat() + '&lt;br/&gt;Longitude: ' + location.lng() + '&lt;br/&gt;&lt;input type="button" id="btn" value="click" onclick="removeMarker()"/&gt;&lt;br/&gt;&lt;a href="http://www.google.com/"&gt;google&lt;/a&gt;'
      });
      infowindow_1.open(map, marker_1);
    }

    google.maps.event.addListener(map, 'click', function(event) {
      placeMarker(map, event.latLng);
    });



  }


  function removeMarker() {

    alert('it works');
  }
&lt;/script&gt;

&lt;script src="https://maps.googleapis.com/maps/api/js?callback=myMap"&gt;&lt;/script&gt;</code></pre>
</div>
</div>
</p>