draw polygon but it draws a line on center - google-maps-api-3

Question

I draw polygon on my map but i get trouble because it draws a line on center if i formed a square or any shapes.I don't know what makes my polygon draw lines on center.
var map;
var count=0;
var polycolor = '#ED1B24';
var polyarray=[];
function initialize() {
var initial = new google.maps.LatLng(53.199246241276875, -105.76864242553711);
var mapOptions = {
zoom: 16,
center: initial,
zoomControl: true,
zoomControlOptions: {
style: google.maps.ZoomControlStyle.LARGE
},
mapTypeControl: false
};
map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
google.maps.event.addListener(map, 'click', function(e) {
polyarray[count]= e.latLng;
addPolygon(polyarray);
count++;
});
}
function addPolygon(path){
var poly = new google.maps.Polygon({
path: path,
strokeColor: polycolor,
strokeOpacity: 1.0,
strokeWeight: 2
});
poly.setMap(map);
}
google.maps.event.addDomListener(window, 'load', initialize);
here is my jsfiddle
my demo

Answer 1

There is not a line down the center, you are drawing a new polygon for each click.
Make the polygon global, and update the path each time you add a point to it:
var poly = new google.maps.Polygon({
strokeColor: polycolor,
strokeOpacity: 1.0,
strokeWeight: 2
});
function addPolygon(path){
poly.setPath(path);
poly.setMap(map);
}
updated fiddle