Anche Google sbaglia! Una svista sul tutorial delle API

Premessa:

Questa roba è solo per veri appassionati fulminati.
Buon Natale.

Non capita tutti i giorni di poter correggere Google a cui noi tutti dobbiamo tanto

Però, per il semplice piacere di sentirci fighi, segnaliamo come i peggio bimbi saccenti da prima fila, un errore di distrazione della maestra.

Su un tutorial di base di google per inserire una Google Map tramite l’utilizzo delle api specifiche, troviamo infatti un banale errore di distrazione

https://developers.google.com/maps/tutorials/fundamentals/adding-a-google-map

Sul tutorial è riportata la semplice procedura per inserire un DIV su cui verrà innestata, secondo i parametri che le passiamo, una Google Map.

I nostri, a metà tutorial, ci suggeriscono di creare una funzione initialize(), in cui settare i parametri di configurazione, e poi di aggiungere un listener, ovvero una “sentinella” che all'inizializzarsi della pagina, richiama la funzione,

A metà del tutorial (The google.maps.Map object), vengono confuse però le variabili.

<script>
  function initialize() {
    var mapCanvas = document.getElementById('map_canvas');
    var mapOptions = {
      center: new google.maps.LatLng(44.5403, -78.5463),
      zoom: 8,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
    var map = new google.maps.Map(map_canvas, map_options);
  }
</script>

Vengono infatti create due variabili:

mapCanvas, a cui assegniamo lo spazio ( il div con id map_canvas) su sui andremo a usare la google map

mapOptions a cui assegniamo tutte le varie opzioni, che ci permetteranno di personalizzare la mappa.

Cosa succede però quando creiamo la variabile/oggetto map? Vengono richiamate due variabili mai create!

Ovvero:

map_canvas e map_options

In realtà, questa è stata una svista banalissima. Basta richiamare le due vere variabili et voilà, l’esempio funziona.

Il fatto della svista, viene ribadito dal fatto che nella sezione: 

The  finished code

La funzione initialize torna ad essere come doveva essere in origine

function initialize() {
        var map_canvas = document.getElementById('map_canvas');
        var map_options = {
          center: new google.maps.LatLng(44.5403, -78.5463),
          zoom: 8,
          mapTypeId: google.maps.MapTypeId.ROADMAP
        }
        var map = new google.maps.Map(map_canvas, map_options)

Cosa dire in conclusione?

Anche google sbaglia...
Quando copi un esempio didattico, non dare per scontato che funzioni

Marco