Как я могу установить точки на картах Google, используя php и местоположения из базы данных?

У меня есть база данных и таблица с именем markers. В этой таблице указаны координаты конкретных местоположений, которые я хочу отметить на карте, используя карты Google. Я могу установить карту на своем веб-сайте, но когда я пытаюсь использовать php для отметки местоположений, я получаю эту ошибку «Uncaught TypeError: Не удается прочитать свойство« offsetWidth »из null».Как я могу установить точки на картах Google, используя php и местоположения из базы данных?

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>X</title> 

    <link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800&subset=latin,cyrillic-ext' rel='stylesheet' type='text/css'> 
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
    <link href="css/estilos.css" rel="stylesheet"> 

    <style type="text/css"> 
      #map { 
       width: 100%; 
       height: 700px; 
      } 
     </style> 
     <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyASm3CwaK9qtcZEWYa-iQwHaGi3gcosAJc&sensor=false"></script> 
     <script type="text/javascript"> 

     $(document).ready(function(){ 
      google.maps.event.addDomListener(window, 'load', init); 


       function init() { 
        var mapOptions = {          
        zoom: 15, 
        center: new google.maps.LatLng(40.2118735,-8.4240415,16); 
        styles: [ {featureType:"administrative",elementType:"all",stylers:[{visibility:"on"},{saturation:-100},{lightness:20}]}, {featureType:"road",elementType:"all",stylers:[{visibility:"on"},{saturation:-100},{lightness:40}]}, {featureType:"water",elementType:"all",stylers:[{visibility:"on"},{saturation:-10},{lightness:30}]}, {featureType:"landscape.man_made",elementType:"all",stylers:[{visibility:"simplified"},{saturation:-60},{lightness:10}]}, {featureType:"landscape.natural",elementType:"all",stylers:[{visibility:"simplified"},{saturation:-60},{lightness:60}]}, {featureType:"poi",elementType:"all",stylers:[{visibility:"off"},{saturation:-100},{lightness:60}]}, {featureType:"transit",elementType:"all",stylers:[{visibility:"off"},{saturation:-100},{lightness:60}]}] 
       }; 

       var mapElement = document.getElementById('map'); 

       var map = new google.maps.Map(mapElement, mapOptions); 
       } 
       }); 


     </script> 

    </head> 
<?php 
    include ('headbar.php'); 
    require ('conexao.php'); 
    $getpoints = mysql_query("SELECT * FROM markers"); 
    if(!$result = $con->query($getpoints)){die('There was an error running the query [' . $con->error . ']'); 
     } else { 
     while ($row = $result->fetch_assoc()) { 
    echo 'var myLatlng1 = new google.maps.LatLng('.$row[lat].', '.$row[lng].'); 
       var marker1 = new google.maps.Marker({ position: myLatlng1, map: map, title:"'.$row[name].'"});'; 
    } 
    } 
?> 
    <body> 
    <div class="container-fluid"> 
     <div id="map"></div> 
    </div> 

    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
    <script src="js/bootstrap.min.js"></script> 
    </body> 
</html>

Я не могу понять, в чем проблема, и я был бы признателен за помощь в этом.

источник

2014-11-12 Almeida

Я боюсь, что вы смешиваете API для MySQL. 'mysql_query' +' $ con> query' –

Спасибо за ответ. Я изменил все на mysql, а теперь подключился к базе данных, и я могу повторить данные, но он по-прежнему не маркирует местоположения на карте. Какие-нибудь советы? – Almeida

@Almeida Если вы хотите поместить фрагменты кода в вопрос/ответ, ваш фрагмент должен быть запущен. Ваш HTML имеет теги на стороне сервера '' это не фрагмент кода запуска. Просто отформатируйте его как код. – bhantol

Первый магазин PHP значения в массиве яваскрипта

В верхней части страницы:

require ('conexao.php'); 
$points = array(); 
$result = mysql_query("SELECT * FROM markers"); 

if(!$result){ 
    die('There was an error running the query [' . $con->error . ']'); 
} else { 
    while ($row = mysql_fetch_assoc($result)) { 
     $points[] = array('lat' => $row['lat'], 'lng' => $row['lng'], 'name' => $row['name']); 
    } 
} 


<script type="text/javascript"> 
    var points = <?php echo json_encode($points); ?>; 
    $(document).ready(function(){ 
     google.maps.event.addDomListener(window, 'load', init); 

      function init() { 
       var mapOptions = {          
        zoom: 15, 
        center: new google.maps.LatLng(40.2118735,-8.4240415,16), 
        styles: [ {featureType:"administrative",elementType:"all",stylers:[{visibility:"on"},{saturation:-100},{lightness:20}]}, {featureType:"road",elementType:"all",stylers:[{visibility:"on"},{saturation:-100},{lightness:40}]}, {featureType:"water",elementType:"all",stylers:[{visibility:"on"},{saturation:-10},{lightness:30}]}, {featureType:"landscape.man_made",elementType:"all",stylers:[{visibility:"simplified"},{saturation:-60},{lightness:10}]}, {featureType:"landscape.natural",elementType:"all",stylers:[{visibility:"simplified"},{saturation:-60},{lightness:60}]}, {featureType:"poi",elementType:"all",stylers:[{visibility:"off"},{saturation:-100},{lightness:60}]}, {featureType:"transit",elementType:"all",stylers:[{visibility:"off"},{saturation:-100},{lightness:60}]}] 
       }; 
       var mapElement = document.getElementById('map'); 
       var map = new google.maps.Map(mapElement, mapOptions); 

        for (var i=0,l=points.length;i<l;i++) { 
         var latLng = new google.maps.LatLng(points[i].lat, points[i].lng); 
         var marker1 = new google.maps.Marker({ position: latLng, map: map, title:points[i].name}); 
        } 
      }     
     }); 


</script>

источник

2014-11-12 00:34:50

Я попытался использовать код, который вы мне отправили, и он дал мне много ошибок в скобках с запятой. Например, строка «var points = ;» – Almeida

Какая ошибка вы получаете? –

Классический «неожиданный токен»; во многих строках – Almeida

Как я могу установить точки на картах Google, используя php и местоположения из базы данных?

ответ

Смежные вопросы