Alex Man Alex Man - 1 year ago 183
Javascript Question

removing default mouseover tooltip from marker in google-maps

I have created an application for showing an Information Window popup for markers, The application is working fine and the popup is showing correctly but the only solution is that along with the custom Information Window popup when under mouse-over, default popup with html tag is showing like as shown below.


enter image description here

Can anyone please tell me some solution for this

My code is as given below

var infowindow = new google.maps.InfoWindow();

function point(name, lat, long) {
var self = this; = name;

var marker = new google.maps.Marker({
position: new google.maps.LatLng(lat, long),
title: name,
map: map,
draggable: true

google.maps.event.addListener(marker, 'mouseover', function () {

infowindow.setContent(marker.title);, marker);

google.maps.event.addListener(marker, 'mouseout', function () {


var map = new google.maps.Map(document.getElementById('googleMap'), {
zoom: 5,
center: new google.maps.LatLng(55, 11),
mapTypeId: google.maps.MapTypeId.ROADMAP

var viewModel = {
points: ko.observableArray([
new point('<div>Test1<br>Test5</div>', 55, 11),
new point('Test2', 56, 12),
new point('Test3', 57, 13)])

function addPoint() {
for (var i = 0; i < viewModel.points().length; i++)
viewModel.points.push(new point('a', 58, 14));


Answer Source

You could manually remove the element title attribute on mouseover.

Try changing

google.maps.event.addListener(marker, 'mouseover', function () {


google.maps.event.addListener(marker, 'mouseover', function (e) {'title');

JSFiddle Link

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download