javascript - google map multiple polyline -

i have google map sample multiple polygons. changed new google.maps.polygon function polyline as

     new google.maps.polyline({                 paths: arr,                 strokecolor: '#ff0000',                 strokeopacity: 0.8,                 strokeweight: 2,                 fillcolor: '#ff0000',                 fillopacity: 0.35             }) 

but not drawing lines. fiddle here. how set object name infowindow content. tried with

 var infowindow = new google.maps.infowindow({             content:         }); 

edited fiddle.

a google.maps.polyline doesn't have paths property. change:

 new google.maps.polyline({             paths: arr,             strokecolor: '#ff0000',             strokeopacity: 0.8,             strokeweight: 2,             fillcolor: '#ff0000',             fillopacity: 0.35         }) 

to:

 new google.maps.polyline({             path: arr,             strokecolor: '#ff0000',             strokeopacity: 0.8,             strokeweight: 2,             fillcolor: '#ff0000',             fillopacity: 0.35         }) 

updated fiddle

code snippet:

var map, infowindow;    function initialize() {      var mapoptions = {        zoom: 5,        center: new google.maps.latlng(24.886436490787712, -70.2685546875),        maptypeid: google.maps.maptypeid.terrain      };        var bounds = new google.maps.latlngbounds();      var polygons = [];      var arr = new array();      var map = new google.maps.map(document.getelementbyid('map-canvas'),        mapoptions);        // define latlng coordinates polygon's path.      var coordinates = {        "feed1": [          [25.774252, -80.190262],          [18.466465, -66.118292],          [32.321384, -64.75737],          [25.774252, -80.190262]        ],          "feed2": [          [26.774252, -81.190262],          [19.466465, -67.118292],          [33.321384, -65.75737],          [26.774252, -81.190262]        ],          "feed3": [          [27.774252, -82.190262],          [20.466465, -68.118292],          [34.321384, -66.75737],          [27.774252, -82.190262]        ]      };      (var in coordinates) {        arr = [];          (var j = 0; j < coordinates[i].length; j++) {          arr.push(new google.maps.latlng(            parsefloat(coordinates[i][j][0]),            parsefloat(coordinates[i][j][1])          ));            bounds.extend(arr[arr.length - 1])        }          // construct polygon.        polygons.push(new google.maps.polyline({          path: arr,          strokecolor: '#ff0000',          strokeopacity: 0.8,          strokeweight: 2,          fillcolor: '#ff0000',          fillopacity: 0.35        }));        polygons[polygons.length - 1].setmap(map);          var infowindow = new google.maps.infowindow({          content: "hello world!"        });          google.maps.event.addlistener(polygons[polygons.length - 1], 'click', function(event) {          infowindow.open(map);          infowindow.setposition(event.latlng);        });        }      map.fitbounds(bounds);          //google.maps.event.addlistener(arr, 'click', showarrays);      // infowindow = new google.maps.infowindow();    }    /*    function showarrays(event) {        var contentstring = '<b>bermuda triangle polygon</b><br>';        // replace info window's content , position.      infowindow.setcontent(contentstring);     // infowindow.setposition(event.latlng);        infowindow.open(map);    } */    google.maps.event.adddomlistener(window, 'load', initialize);

  html,    body,    #map-canvas {      height: 100%;      margin: 0px;      padding: 0px    }

<script src="https://maps.googleapis.com/maps/api/js"></script>  <div id="map-canvas"></div>