Voici un exemple d’utilisation de la classe GStreetviewPanorama au sein de l’infobulle rattachée à un marker.

Pour afficher le streetView, cliquez sur le marker de votre choix. Si streetView n’est pas disponible pour la vue en cours, un message le signalera dans l’infobulle.

Dans cet exemple, les markers sont déplaçables. Vous pouvez donc déplacer un marker puis cliquer sur celui-ci afin d’afficher l’infobulle contenant le streetView à l’endroit où se trouve le marker une fois relâché.

CODE

<script type="text/javascript">
   /* Fonction chargée d'appeler StreetView une fois l'infobulle ouverte */
   function displayStreetView(lat,lng){
      document.getElementById("streetView").innerHTML = '';
      /* On efface le message d'attente */
      StreetView = new GStreetviewPanorama(document.getElementById("streetView"));
      /* Déclaration de l'objet streetview */
      GEvent.addListener(StreetView, "error", handleNoFlash);
      /* Fonction "handleNoFlash" à appeler si erreur */
      var options = {yaw : 380, pitch : 0, zoom : 0};
      /* Options du streetView :
      yaw : angle de vue horizontal de la caméra
      pitch : angle de vue vertical de la caméra
      zoom : niveau de zoom pour la vue Street View
      */
      StreetView.setLocationAndPOV(new GLatLng(lat,lng), options);
   }

   /* Affiche le message d'erreur à la place du streetView */
   function handleNoFlash(errorCode) {
      var msg = "Streetview n'est pas disponible pour cette localisation...";
      document.getElementById("streetView").innerHTML = msg;
      return;
   }  

   /* Déclaration de la carte */
   var map = new GMap2(document.getElementById('map'),
   { size: new GSize(635,700), mapTypes: [G_HYBRID_MAP]});
   var myPoints = [];
   var bounds = new GLatLngBounds();

   /* Déclaration des points à afficher sur la carte */
   myPoints.push( new GLatLng(48.8566667, 2.3509871)); // Paris
   myPoints.push( new GLatLng(48.8123155, 2.2381535)); // Meudon
   myPoints.push( new GLatLng(48.3906042, -4.4869013)); // Brest
   myPoints.push( new GLatLng(50.6371834, 3.0630174)); // Lille

   /*Affichage des points sur la carte */
   for(var i = 0; i < myPoints.length; i++){
      bounds.extend(myPoints[i]);
      var thisMarker = addThisMarker(myPoints[i]);
      map.addOverlay(thisMarker);
   }

   /* Association événements / markers */
   function addThisMarker(point){
      var marker = new GMarker(point, {draggable : true});
      GEvent.addListener(marker, "click", function(latlng) {
         var lat = latlng.lat();
         var lng = latlng.lng();
         marker.openInfoWindowHtml('<div id="streetView" style="width: 500px;
	 height: 250px; text-align:center">Street View en cours de chargement ...</div>');
         setTimeout("displayStreetView('"+lat+"','"+lng+"');",2500);
      });
      GEvent.addListener(marker, "dragstart", function() {
         marker.closeInfoWindow();
      });
     GEvent.addListener(marker, "dragend", function(latlng) {
         var lat = latlng.lat();
         var lng = latlng.lng();
         marker.openInfoWindowHtml('<div style="font-family:arial; font-size: 11px;">
	 <h4 align="center" style="margin: 2px;">Informations liées au point</h4>
	 <b>Latitude</b> :'+lat+'<br /><b>Longitude </b>:'+lng+'</div>');
      });
      return marker;
   } 

   /* Récupération des limites de la carte */
   var newZoom = map.getBoundsZoomLevel(bounds);

   /* Récupération du nouveau centre de la carte */
   var newCentre = bounds.getCenter();

   /* Ajout des outils de contrôle sur la carte */
   map.addControl(new GOverviewMapControl());

   /* Affichage de la carte */
   map.setCenter(new Centre, newZoom);

</script>

La classe GTileLayerOverlayOptions représente des arguments optionnels du constructeur GTileLayerOverlay.

On l’instancie directement comme un objet, elle ne dispose pas de constructeur.

Elle ne propose qu’une seule propriété, à savoir la propriété zPriority (z-index).

prorpriété zPriority

Disponible depuis la version 2.110 de l’Api.

Cette propriété contient la valeur de z-index attribuée à l’objet GTileLayerOverlay concerné par rapport aux autres éléments de la carte.
Plus cette valeur est élevée, plus l’objet est positionné au-dessus (en avant) dans la pile d’overlay concernés et inversement.

La classe GTileLayerOverlay permet d’ajouter des éléments à vos cartes au moyen de l’interface GTileLayer.

Elle implémente l’interface GOverlay et ajoute donc un nouvel objet de type GTileLayer au-dessus la carte indépendant de celle-ci (et non un nouvel élément au sein de la carte).
Pour remplacer les images des vues existantes, il faut déclarer l’objet GTileLayer à l’intérieur de l’objet de type GMapType.

constructeur GTileLayerOverlay

Disponible depuis la version 2.61 de l’Api.

Signature du constructeur GTileLayerOverlay:
GTileLayerOverlay(tileLayer : GTileLayer, opts ? : GTileLayerOverlayOptions) .

Ce constructeur créé un nouvel objet de type GOverlay qui encapsule l’objet GTileLayer passé en paramètre.

Exemple d’utilisation

Dans cet exemple, nous utiliserons la démonstration expliquant l’utilisation de l’interface GTileLayer.

<script type="text/javascript">

   var GTILE = new GTileLayerOverlay(monTypeDeTuile);
   /* Ici, nous déclarons un objet GTileLayerOverlay
   encapsulant l'objet monTypeDeTuile "par-dessus" la map.
   Cet objet sera donc indépendant l'objet GMapType .*/

   map.addOverlay(GTILE);
   /* On ajoute l'objet à la carte.
   Il faut nécessairement utiliser la méthode "addOverlay"
   si on souhaite pouvoir appliquer des méthodes à l'objet. */

   GTILE.hide();
   /* A l'aide de la méthode "hide()",
   on le rend invisible. */

   if(GTILE.isHidden())
      alert('invisible');
   else
      alert('visible');
   /* A l'aide de la méthode "ishidden()",
   on teste l'affichage de l'objet. */

</script>

hide()

Disponible depuis la version 2.71 de l’Api.

La méthode hide() cache l’objet concerné tout en maintenant sa position dans la pile des objets overlay existants.

isHidden()

Disponible depuis la version 2.87 de l’Api.

La méthode isHidden() retourne true si la couche contenant l’objet est cachée. Elle retourne false le celle-ci est visible.

show()

Disponible depuis la version 2.71 de l’Api.

La méthode show() rend à nouveau visible un objet GTileLayerOverlay précédemment rendu invisible.

refresh()

Disponible depuis la version 2.132 de l’Api.

La méthode refresh() recharge l’ensemble des objets visibles attachés à l’objet GTileLayerOverlay sur lequel elle est appliquée.

supportsHide()

Disponible depuis la version 2.87 de l’Api.

La méthode supportsHide() retourne toujours true.

getTileLayer()

Disponible depuis la version 2.83 de l’Api.

La méthode getTileLayer() retourne l’objet GTileLayer utilisé pour l’overlay concerné..

L’interface GOverlay est implémentée par les classes GMarker, GPolyline [bientôt en ligne], GTileLayerOverlay, GInfoWindow au sein de la librairie de l’Api Google Map.

On peut également faire appel à cette interface lorsque l’on souhaite afficher des types d’objets personnalisés sur une carte.

Une instance de l’objet GOverlay peut être réalisée sur une carte au moyen de la méthode GMap2.addOverlay. La carte fera alors appel à la méthode GOverlay.initialize sur cette instance afin d’afficher l’objet sur la carte au chargement.
Chaque fois que l’affichage de la carte change, la carte fait appel à la méthode GOverlay.redraw afin de repositionner l’objet concerné, si nécessaire, au bon endroit.
Cette instance peut également utiliser la méthode GMap2.getPane pour y associer un ou plusieurs éléments du DOM.

constructeur GOverlay

Ce constructeur créé une implémentation minimum pour l’utilisation des méthodes associées. Lorsqu’une classe hérite de cet élément, le constructeur de cette classe dérivée doit faire appel au constructeur GOverlay afin d’être complète.

GOverlay.getZIndex

Signature de la méthode GOverlay.getZIndex:
GOverlay.getZIndex(latitude : Number) .

Cette méthode retourne la valeur CSS z-index de l’objet concerné pour une latitude donnée. Ce z-index est calculé en suivant le principe que les éléments les plus au Sud se positionnent par-dessus (z-index supérieur) aux éléments les plus au Nord (ce qui donne par exemple l’aspect 3D d’un marqueur).

initialize

Signature de la méthode initialize:
initialize(map : GMap2) .

Cette méthode est appelée par la carte dès lors qu’un nouvel objet à y superposer est ajouté au moyen de la méthode GMap2.addOverlay.

Cet objet à superposer peut se replacer à chaque changement d’affichage de la carte sur les différentes vues en utilisant la méthode GMap2.getPane.

remove

Signature de la méthode remove:
remove().

Cette méthode est appelée par la carte dès lors qu’un objet est supprimé de la carte au moyen des méthodes GMap2.removeOverlay ou GMap2.clearOverlays.

L’objet concerné est alors retiré de la carte.

copy

Signature de la méthode copy:
copy().

Cette méthode retourne une copie non initialisée de l’objet overlay concerné qui peut alors être ajouté à la carte.

redraw

Signature de la méthode redraw:
redraw(force : Booléen).

Cette méthode est appelée lorsque l’affichage de la carte a changé. L’argument force vaudra true si le niveau de zoom ou les coordonnées en pixels de la carte ont également changé. Dans ce cas, ces coordonnées seront recalculées.

getKml

Disponible depuis la version 2.167 de l’Api.

Signature de la méthode getKml:
getKml(callback : Fonction) .

Cette méthode est utilisée pour obtenir la représentation KML de l’objet overlay de façon asynchrone. La fonction de retour est appelée avec un argument littéral qui est une chaîne partielle KML représentant l’objet overlay ou null si aucune représentation KML n’est disponible.

Cette chaîne au format KML ne contiendra ni les balises de déclaration XML ni l’élément racine .