Расширяемое наложение маркера карты для API Карт Google v3

Question

Я уже давно использую Google Maps API v3. Я хочу создать расширяемый маркер карт Google для использования с моей картой. Я использовал маркеры карт, аналогичные тем, которые изображены ниже: -

Что я хочу сделать, так это то, что когда я нахожу этот маркер на своей карте, он должен расширяться и показывать описание маркера, аналогично изображение ниже -

И маркер должен вернуться к первому изображению, то есть нормальному изображению при наведении указателя мыши. Это должно быть достаточно просто, но я не знаю, где и как начать. Любая помощь будет действительно оценена.

Answer 1

Вы можете использовать marker.setIcon на mouseover и mouseout:

google.maps.event.addListener(marker, 'mouseover', function() { 
    marker.setIcon('http://i.stack.imgur.com/t7vAK.png'); 
}); 
google.maps.event.addListener(marker, 'mouseout', function() { 
    marker.setIcon('http://i.stack.imgur.com/TrIat.png'); 
}); 

Демо: http://jsfiddle.net/mzu2qte5/2/

Небольшая проблема с этим решением является то, что стрелка значок «Hello World» должен быть помещен в середине значок, вместо этого перемещен влево, как сейчас.

Таким образом, вы теряете эффект «расширения».