javascript — при наведении курсора мыши на событие не работает на полилинии?

Я рисую многоугольник на карте Google и даю указатель мыши для события полилинии (только одна линия) на карте Google.
На полилинию не добавляются события.

function checkArea(area){

area_global = area;

if( area.getPath().getLength() != max ){

area.setMap(null);

alert('Area must have 4 sides!');

}

else{

areaBounds = new google.maps.LatLngBounds();

for( i = 0; i < area.getPath().getLength(); i++ ){

if( typeof( sides[i] ) != 'undefined' ) sides[i].setMap(null);

start = [ area.getPath().getAt(i).lat(), area.getPath().getAt(i).lng() ];
end = i == max - 1 ? [ area.getPath().getAt(0).lat(), area.getPath().getAt(0).lng() ] : [ area.getPath().getAt(i + 1).lat(), area.getPath().getAt(i + 1).lng() ];

coordinates[i] = [
new google.maps.LatLng( start[0], start[1] ),
new google.maps.LatLng( end[0], end[1] )
];

sides[i] = new google.maps.Polyline({
path: coordinates[i],
strokeColor: orange,
strokeWeight: 5
});sides[i].setMap(map);

areaBounds.extend( coordinates[i][0] );

google.maps.event.addListener(sides[i], 'mouseover', function(){   //event that fires when polygon is clicked
if( this.strokeColor != red ) this.setOptions({ strokeColor: darkOrange, zIndex: 2 });

});

google.maps.event.addListener(sides[i], 'mouseout', function(){ //event that fires when polygon is clicked
if( this.strokeColor == darkOrange ) this.setOptions({ strokeColor: orange, zIndex: 2 });

});

google.maps.event.addListener(sides[i], 'click', function(){ //event that fires when polygon is clicked

for( i = 0; i < sides.length; i ++ ) sides[i].setOptions({ strokeColor: orange, zIndex: 1 });

this.setOptions({ strokeColor: red, zIndex: 2 });

lineBounds = new google.maps.LatLngBounds();
lineBounds.extend( this.getPath().getAt(0) );
lineBounds.extend( this.getPath().getAt(1) );

var direction = google.maps.geometry.spherical.computeHeading( areaBounds.getCenter() , lineBounds.getCenter() ); //almost working.  Need to get it better for irregular shapes (trapeziums etc)

direction = direction < 0 ? direction + 360 : direction;

bearing = direction < 1 ? 0 : Math.round( Math.round( direction / 22.5 ) * 22.5 );

var roofOrientation = Math.round( direction / 5 ) * 5;

$('#roof-orientation').val( roofOrientation ).attr('data-bearing', bearings[ bearing ] );

if( this.getPath().getAt(0).lat() > 0 && roofOrientation > 270 || this.getPath().getAt(0).lat() > 0 && roofOrientation < 90 ) alert('The closer your roof is to facing north the poorer the electricity generation will be.');

else if( this.getPath().getAt(0).lat() < 0 && roofOrientation < 270 && roofOrientation > 90 )  alert('The closer your roof is to facing south the poorer the electricity generation will be.');

callAPI();

});if( drawingManager.getDrawingMode() ){

drawingManager.setOptions({
drawingMode: null
});

}
/*$('#map-draw').removeClass('active').text('Click to redraw');*/

}

$('#area').val( Math.round( google.maps.geometry.spherical.computeArea( area.getPath() ) ) ).change();

}

-1

Решение

google.maps.event.addListener(sides[i], 'mouseover', function(){   //event that fires when polygon is clicked
if( this.strokeColor != red ) this.setOptions({ strokeColor: darkOrange, zIndex: 2 });
}.bind( map ));

Внутри функции слушателя есть ссылки на ключевое слово this, вызывающие функции и устанавливающие свойства по внешнему виду кода. Ключевое слово this должно ссылаться на объект, для которого метод или свойство нацелены в слушателе. В противном случае он может ссылаться, в этом случае, на стороны [i] как объект.

0

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]