Puis-je supprimer uniquement les bulles contextuelles des POI dans Google Maps API v3?

Question

Donc, je suis en train de travailler sur une nouvelle application web qui met l'accent sur les cartes. À l'aide de l'API Google Maps v3 et vraiment heureux avec elle, mais il a remarqué que les points d'intérêt (POI) ont automatiquement des bulles avec plus de détails et un lien vers la page Google adresses. Je ne veux pas de ces. Voici mon code:

map = new google.maps.Map(document.getElementById("map"), {
    center:new google.maps.LatLng(default_latitude,default_longitude),
    zoom:11,
    mapTypeId:google.maps.MapTypeId.ROADMAP,
    mapTypeControl:false,
    panControl:false
});

Je sais que vous pouvez supprimer les POI entièrement. Voici mon code:

map = new google.maps.Map(document.getElementById("map"),{
    center:new google.maps.LatLng(default_latitude,default_longitude),
    zoom:11,
    mapTypeId:google.maps.MapTypeId.ROADMAP,
    mapTypeControl:false,
    panControl:false,
    styles:[{
        featureType:"poi",
        elementType:"labels",
        stylers:[{
            visibility:"off"
        }]
    }]
});

Cela supprime tout entier et j'aimerais voir les étiquettes que je pense qu'ils apportent de la valeur, mais pense juste que les bulles sont trop de distraction.

Pour référence, voici la bulle je veux supprimer:

Et ici, c'est la même carte avec les points d'intérêt de les enlever:

Answer 1

Version ~3.12 correctif. Démo

Voici un nouveau patch, qui fonctionne encore. Je l'ai testé avec la version 3.14.

Maintenant, nous allons patch set() au lieu de open().

function fixInfoWindow() {
    //Here we redefine set() method.
    //If it is called for map option, we hide InfoWindow, if "noSupress" option isnt true.
    //As Google doesn't know about this option, its InfoWindows will not be opened.
    var set = google.maps.InfoWindow.prototype.set;
    google.maps.InfoWindow.prototype.set = function (key, val) {
        if (key === 'map') {
            if (!this.get('noSupress')) {
                console.log('This InfoWindow is supressed. To enable it, set "noSupress" option to true');
                return;
            }
        }
        set.apply(this, arguments);
    }
}

Ce que vous avez à faire est de définir l'option noSupress de true pour votre propre InfoWindows, afin de leur ouvrir, par exemple:

var popup = new google.maps.InfoWindow({
    content: 'Bang!',
    noSupress: true
});
popup.setPosition(new google.maps.LatLng(-34.397, 150.644));

popup.open(map);

ou:

var popup = new google.maps.InfoWindow({
    content: 'Bang!',
});

popup.set('noSupress', true);
popup.setPosition(new google.maps.LatLng(-34.397, 150.644));

popup.open(map);

Answer 2

Trouvé une solution de contournement! Il est assez sale, donc il peut cesser de fonctionner si google change quelque chose, mais ça fonctionne!

Vous devez trouver les couches où google met la infoWindows pour les Pi. Fortunatelly ces couches sont différentes des couches utilisées pour les utilisateurs infoWindows. Le truc est de trouver la bonne couches. L'ombre de la couche peut être trouvé facilement, mais l'infoWindow calque est créé après quelques PI infoWindow est créé, de sorte que vous avez à écouteur pour l'événement click sur le même div que google n'. Alors vous trouvez que le PVE de l'infoWindow couche z-index, ou par l'url de l'image mais ce n'est pas bien testé... à Noter que si google change le z-index, il s'arrête de travailler...

var lis = google.maps.event.addListener(my_map, 'tilesloaded', function () {

    $('*').filter(function () { return $(this).css('z-index') == 104 }).remove();
        // remove layer for POI infoWindow shadow - has z-index: 104

    var eventDiv = $(my_map.getDiv()).children().children()[0];
        // this div is used by google to handle events

    $(eventDiv).click(function clickHandler() {
        var timeout = 100;
        var attempts = 20;
        setTimeout(function timeoutHandler() {
            // there are 2 ways how to find POI infoWindow layer
            // 1st way - by the z-index
            var poiInfoLayer = $('*').filter(function () { 
                return $(this).css('z-index') == 169 || 
                       $(this).css('z-index') == 248 
            });
            // 2nd way - by the images :-)
            // but not tested much - it may also find normal infoWindows!
            //var poiInfoLayer = $('[src*="/mapfiles/iw3.png"]').parent().parent();

            if (poiInfoLayer.length) {
                    poiInfoLayer.remove();
                    $(eventDiv).unbind('click', clickHandler);
            }
            else {
                    if (attempts > 0) {
                            setTimeout(timeoutHandler, timeout);
                            attempts--;
                    }
            }

        }, timeout);
    });
    google.maps.event.removeListener(lis);
});

Answer 3

Ne fonctionne plus depuis la mise à jour de l'API Google Maps.

Je l'ai trouvé enfin!!!

Voici la démo: http://jsfiddle.net/fbDDZ/14/ (en cliquant sur "ouvrir" ou ci ne fait rien, en cliquant sur "ouvrir s'il vous plaît" ouvre l'InfoWindow)

L'idée est de patch InfoWindow.le prototype.ouvert de manière à lui permettre d'accepter le troisième argument. Google ne passe pas, mais nous devrions le faire.

Le code:

function fixInfoWindow() {
    var proto = google.maps.InfoWindow.prototype,
        open = proto.open;
    proto.open = function(map, anchor, please) {
        if (please) {
            return open.apply(this, arguments);
        }
    }
}

Google ouvre InfoWindow sur un PI comme ça:

myInfoWin.open(map, poiMarker)

La fenêtre ne s'ouvre pas, parce que Google n'a pas de dire "s'il vous plaît". C'est la façon dont nous devrions ouvrir nos fenêtres d'informations:

myInfoWin.open(map, poiMarker, true);

Answer 4

Ok, après avoir cherché partout, il semble que vous ne pouvez pas afficher les Poi avec cliquant sur désactivé, vous pouvez regarder ici pour plus de discussions:

http://groups.google.com/group/google-maps-js-api-v3/browse_thread/thread/f1ac9ad4da3606fe/3975bbda46904ae7?lnk=gst&q=disable+poi#3975bbda46904ae7

et cet échange, en particulier:

---

Salut,

Est-il possibilltiy faire Pi visible mais pas cliquable?

Merci Lorenzo

---

Chris Broadfoot

Malheureusement pas Lorenzo. Vous aurez besoin d'appliquer un style de carte masquer pi étiquettes:

[ { type: "pi", type d'élément: "étiquettes", produits coiffants: [ { visibilité: "off" } ] } ]

(ou tout simplement cacher les affaires de poi, poi".d'affaires")

---

Cela vient de Google Maps développeurs, ce qui signifie que vous ne pouvez pas désactiver le pop-up, juste de la Pi.

Answer 5

J'inspecterais l'élément à l'aide de Firebug et j'utiliserais display:none !important; pour supprimer ces styles si Google ne vous autorise pas à y accéder directement via l'API (ce que je pense que vous devriez pouvoir)