'Uncaught InvalidValueError' (: setCenter: non un oggetto LatLng o LatLngLiteral)

Sto iniziando a conoscere PHP e JavaScript, mescolandoli in HTML e utilizzando l'API di Google Maps (versione 3).'Uncaught InvalidValueError' (: setCenter: non un oggetto LatLng o LatLngLiteral)

ho pensato come 'mettere' diversi marcatori ma la console mi genera un errore:

"InvalidValueError Uncaught: setCenter: non un LatLng o un oggetto LatLngLiteral".

Penso che sia perché la var creata nel ciclo non è esattamente l'oggetto necessario ma invece una stringa, anche se questo mi confonde, non so se ho ragione. Lo apprezzerei molto se qualcuno potesse mettermi sulla strada giusta.

Grazie in anticipo.

Questo è il mio codice: (A proposito, l'array sto loop è una matrice con un array con una matrice, ecco alcune delle quali si segue il modello, ci sono in totale 6 'posti'.) :

$locations = array(
     array(
      'Location' => array(
       'Title'=>'Place', 
       'Description'=>'Some Place', 
       'Image'=>'pin1.png', 
       'Latitude'=>'20.681775', 
       'Longitude'=>'-103.351479' 
      ) 
     ),…

(Continua ...).

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map-canvas { height: 100% } 
    </style>  

     <script type="text/javascript" 
      src="https://maps.googleapis.com/maps/api/js?AIzaSyBVfO8LckdOHAot1a8rZW0bmJIoWO2A3os=API_KEY&sensor=true"> 
     </script> 


     <script type="text/javascript"> 
     function initialize() { 
     var mapOptions = { 
      center: (20.68177501, -103.3514794), 
      zoom: 15, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map-canvas"), 
      mapOptions); 

     // To add the marker to the map, use the 'map' property 
     <?php $i = 0; ?> 
     <?php foreach($locations as $key => $value): ?> 
       <?php foreach($value as $key => $value): ?> 
        <?php foreach($value as $key => $value): ?> 
         <?php if($key == "Latitude"): ?> 
          <?php $myLatLng = "$value, "; endif;?> 
         <?php if($key == "Longitude"): ?> 
          <?php $myLatLng .="$value"; ?> 

     var myLatlng<?php echo $i; ?> = new google.maps.LatLng(<?php echo $myLatLng; ?>); 
     var marker<?php echo $i; ?> = new google.maps.Marker({ 
     position: (myLatlng<?php echo $i; ?>), 
     title:"Hello World!" 
     }); 
     marker<?php echo $i; ?>.setMap(map); 

          <?php $i++; ?> 
         <?php endif; ?> 
        <?php endforeach; ?> 
       <?php endforeach; ?> 
     <?php endforeach; ?> 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 


    </head> 
    <body> 
    <div id="map-canvas"/> 
    </body> 
</html>

Ed ecco uno screenshot di che var assegnazione di parte: "http://cl.ly/image/1d3e2J360t3y"

fonte

2013-11-15 Adrián

È anche interessante notare che Google Maps v3 non sembra disinfettare i valori dei dati per l'impostazione degli indicatori. Questo sembra essere cambiato nelle ultime settimane, perché in precedenza stavo passando in altezza icona come stringa per la funzione MarkerImage di google (proveniente da JSON). Ma improvvisamente si è rotto perché non era un "numero".

Ovviamente la soluzione è quella di passare un numero o avvolgere i dati in parseInt() o parseFloat() in modo che l'API ottenga un numero o un valore. Google "dovrebbe" sanificare i suoi dati ma non lo è.

var custom_icon = new google.maps.MarkerImage(
    icon_path, 
    new google.maps.Size(
     parseInt(icon_options.width), 
     parseInt(icon_options.height) 
    ), 
    new google.maps.Point(
     parseFloat(icon_options.origin_x), 
     parseFloat(icon_options.origin_y) 
    ), 
    new google.maps.Point(
     parseFloat(icon_options.anchor_x), 
     parseFloat(icon_options.anchor_y) 
    ) 
);

fonte

2014-09-29 18:01:28

Si inizializza mapOptions in modo sbagliato.

inizializzare in modo seguente ..

var mapOptions = { 
      center: new google.maps.LatLng(20.68177501, -103.3514794), 
      zoom: 15, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     };

Invece di ...

var mapOptions = { 
      center: (20.68177501, -103.3514794), //this is not correct 
      zoom: 15, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     };

Seguendo codice viene corretta ...

<!DOCTYPE html> 
<html> 
    <head> 
    <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 
    <style type="text/css"> 
     html { height: 100% } 
     body { height: 100%; margin: 0; padding: 0 } 
     #map-canvas { height: 100% } 
    </style>  

     <script type="text/javascript" 
      src="https://maps.googleapis.com/maps/api/js?AIzaSyBVfO8LckdOHAot1a8rZW0bmJIoWO2A3os=API_KEY&sensor=true"> 
     </script> 


     <script type="text/javascript"> 
     function initialize() { 
     var mapOptions = { 
      center: new google.maps.LatLng(20.68177501, -103.3514794), 
      zoom: 15, 
      mapTypeId: google.maps.MapTypeId.ROADMAP 
     }; 
     var map = new google.maps.Map(document.getElementById("map-canvas"), 
      mapOptions); 

     // To add the marker to the map, use the 'map' property 
     <?php $i = 0; ?> 
     <?php foreach($locations as $key => $value): ?> 
       <?php foreach($value as $key => $value): ?> 
        <?php foreach($value as $key => $value): ?> 
         <?php if($key == "Latitude"): ?> 
          <?php $myLatLng = "$value, "; endif;?> 
         <?php if($key == "Longitude"): ?> 
          <?php $myLatLng .="$value"; ?> 

     var myLatlng<?php echo $i; ?> = new google.maps.LatLng(<?php echo $myLatLng; ?>); 
     var marker<?php echo $i; ?> = new google.maps.Marker({ 
     position: (myLatlng<?php echo $i; ?>), 
     title:"Hello World!" 
     }); 
     marker<?php echo $i; ?>.setMap(map); 

          <?php $i++; ?> 
         <?php endif; ?> 
        <?php endforeach; ?> 
       <?php endforeach; ?> 
     <?php endforeach; ?> 
     } 
     google.maps.event.addDomListener(window, 'load', initialize); 
    </script> 


    </head> 
    <body> 
    <div id="map-canvas"/> 
    </body> 
</html>

fonte

2013-11-15 07:23:44 nik

-1

provare a cancellare la linea

<script type="application/javascript" src="google_maps/google_maps.js"></script>

e mantenere

<script type="application/javascript" src="http://maps.googleapis.com/maps/api/js?key=your-api-key"></script>

fonte

2017-02-13 18:37:59 Smaran

questo sarà solo rimuovere le mappe di Google sceneggiatura, rendendo tutto il suo codice che fa riferimento all'API, rotto. Non vedo come questo possa aiutare in alcun modo. –

'Uncaught InvalidValueError' (: setCenter: non un oggetto LatLng o LatLngLiteral)

risposta

Problemi correlati