Google Javascript Map v3

时间:2015-04-24 14:09:11

标签: javascript google-maps google-maps-api-3 geolocation ip-geolocation

我正在开发一个带有标记和地理位置的地图,所有内容都适用于Chrome,但在Safari(OSX 10.10.3)上无法使用地理定位。

即使是Google工作的示例页面

也是如此

link:https://developers.google.com/maps/documentation/javascript/examples/map-geolocation

在safari上没有使用chrome时。

我在我的代码中包含了这个库。

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true&sensor=true"></script>

谢谢

1 个答案:

答案 0 :(得分:0)

这是我的代码。

页面测试链接:http://francescozito.eu/app/test

他的行为很奇怪

// definisco l'oggetto che rappresenta il centro della mappa, a cui passo le coordinate (variabili Php)
var GOOGLE_PALERMO = new google.maps.LatLng(38.133725, 13.349735);
var CAFE_CARTARI = new google.maps.LatLng(38.11694730000001, 13.365525899999966);
var BICI_CANNATELLA = new google.maps.LatLng(38.1175329, 13.351235900000006);
var AMAZZONIA = new google.maps.LatLng(38.125611, 13.351576099999988);
var ASD_I_CICLOPI = new google.maps.LatLng(38.1329123, 13.34007650000001);
var EDICOLA_E = new google.maps.LatLng(38.1380411, 13.337050500000032);
var ITALSUISSE = new google.maps.LatLng(38.1382892, 13.336938700000019);
var I_LIBRI_DI_ANDREA = new google.maps.LatLng(38.1392185, 13.347450900000013);
var MAIL_BOX = new google.maps.LatLng(38.1406649, 13.350653800000032);
var LEIMA = new google.maps.LatLng(38.1442414, 13.359304500000007);

var centro = GOOGLE_PALERMO;

// definisco l'array dei punti di interesse, a cui passo la stringa costruita in Php
var puntiinteresse = [ CAFE_CARTARI, BICI_CANNATELLA, AMAZZONIA, ASD_I_CICLOPI, EDICOLA_E, ITALSUISSE, I_LIBRI_DI_ANDREA, MAIL_BOX, LEIMA ];

// definisco l'array delle descrizioni, a cui passo la stringa costruita in Php
var descrizioni = ["CAFE' CARTARI","BICI CANNATELLA", "AMAZZONIA", "ASD I CICLOPI", "EDICOLA E... di Mercurio Vito", "ITALSUISSE di S.G. D'Errico", "I LIBRI DI ANDREA", "MAIL BOX", "LEIMA Editore" ];
var vie = ["Via dei Cartari, 1","Via Papireto, 14/a", "Via Principe di Villafranca 44a", "Via Daldone 3", "Via Principe di Paternò 126", "Via Principe di Paternò 105", "Via Mario Rutelli 24", "Via Autonomia Siciliana 28", "Via Altavilla 55"];

var red = 'http://maps.google.com/mapfiles/ms/icons/red-dot.png';
var blue = 'http://maps.google.com/mapfiles/ms/icons/blue-dot.png';
var green = 'http://maps.google.com/mapfiles/ms/icons/blue-dot.png';

var markers = [];
var infoWindows = [];
var currentInfoWindow;
var j = 0;

var map;
var map_percorsi;


/* Percorsi */
  var percorso = [ GOOGLE_PALERMO, CAFE_CARTARI, BICI_CANNATELLA, AMAZZONIA, ASD_I_CICLOPI];
  var percorso2 = [ EDICOLA_E, ITALSUISSE, I_LIBRI_DI_ANDREA, MAIL_BOX, LEIMA ];
  var percorso3 = [ ASD_I_CICLOPI, EDICOLA_E ];

  var percorsi_group = [ percorso, percorso2, percorso3 ];
  var percorsi_color = ["#f00", "#000", "#ff0"];

  var poly = [];

  /*****/

function initialize() 
{

  if ( navigator.geolocation ) 
  {
    // Find the users current position.  
    // Cache the location for 5 minutes, timeout after 6 seconds
    navigator.geolocation.getCurrentPosition(success, fail, {maximumAge: 500000, enableHighAccuracy:true, timeout: 6000});
  } else 
    {
      drawMap(centro);  // No geolocation support, show default map
    }
}

function success(pos) 
{
  // Location found, show map with these coordinates
  drawMap(new google.maps.LatLng(pos.coords.latitude, pos.coords.longitude));
  //drawMap(centro); 
}

function fail(error) 
{
  drawMap(centro);
  // Failed to find location, show default map
}

function drawMap(latlng) 
{
    var mapOptions = {
    zoom: 14,
    mapTypeId: google.maps.MapTypeId.ROADMAP,
    center: latlng
  };

  map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
  map_percorsi = new google.maps.Map(document.getElementById('map-percorsi'), mapOptions);

  disegna_percorsi();


}

function geocalizzami()
{
  if ( navigator.geolocation ) 
  {
    navigator.geolocation.getCurrentPosition(ti_ho_geolocalizzato, nessuna_geolocalizzazione, {maximumAge: 500000, enableHighAccuracy:true, timeout: 6000});
  } else 
    {

    }
}

function ti_ho_geolocalizzato(pos) 
{
  alert(pos.coords.latitude+" -- "+pos.coords.longitude);
  map.panTo(pos.coords.latitude, pos.coords.longitude);
}

function nessuna_geolocalizzazione(error) 
{
  alert("Geolocalizzazione non possibile");
}

function disegna_percorsi()
{
  for(var p = 0; p < percorsi_group.length; p++)
  {
    poly[p] = new google.maps.Polyline({
      path: percorsi_group[p],
      geodesic: true,
      strokeColor: percorsi_color[p],
      strokeOpacity: 1,
      strokeWeight: 2
    });

    poly[p].setMap(map_percorsi);
  }
}

function drop() 
{
  for (var i = 0; i < puntiinteresse.length; i++) 
  {
    setTimeout(function() 
    {
      addMarker();
    }, i * 300);
  }
}

function addMarker() 
{

  var marker = new google.maps.Marker({
    position: puntiinteresse[j],
    map: map,
    icon: blue,
    draggable: false,
    title: descrizioni[j],
    animation: google.maps.Animation.DROP,
    infoWindowIndex : j //<---Thats the extra attribute
  });


  var content = '<span><h5 style="color:blue">Network Ospitalit&agrave; Ciclisti</h5><h4 style="color:black">' + descrizioni[j] + '</h4><h6 style="color:black">' + vie[j] + '</h6></span></div>';
  var infoWindow = new google.maps.InfoWindow({
      content : content
  });

  google.maps.event.addListener(marker, 'click', 
      function(event)
      {
          if (currentInfoWindow != null) { 
              currentInfoWindow.close(); 
          } 

          map.panTo(event.latLng);
          //map.setZoom(5);
          infoWindows[this.infoWindowIndex].open(map, this);
          currentInfoWindow = infoWindows[this.infoWindowIndex];
      }
  );

  infoWindows.push(infoWindow);
  markers.push(marker);
  j++;
}