通过使用php中mysql的数据在Google地图上显示标记

Question

我在这里附上图像作为示例。

目前，我在HTML页面中使用静态代码（例如，

Java脚本可在页面上加载地图：

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

 <script type="text/javascript">
   var map;
   var centerPos = new google.maps.LatLng(37.0902,95.7129);
   var zoomLevel = 4;
   function initialize() 
    {
      var mapOptions = 
      {
       center: centerPos,
       zoom: zoomLevel
      };
      map = new google.maps.Map( document.getElementById("map-canvas"), mapOptions );
    }
    google.maps.event.addDomListener(window, 'load', initialize);
  </script>

谷歌地图Div：

    <div id="Community-Google-Map-Div">
          <div class="wrap">
            <div id="map-canvas">
            </div>
          </div>
    </div>

Java脚本加载不同的位置：

  <script type="text/javascript">

    function LocateSales() 
    {
      var map;
      var centerPos = new google.maps.LatLng(22.4700,77.5667);
      var zoomLevel = 4;

      var mapOptions = 
      {
        center: centerPos,
        zoom: zoomLevel
      };
      map = new google.maps.Map( document.getElementById("map-canvas"), mapOptions );

      var locations = [ ['USA', 50.0000, 79.7800],
                        ['Second', 82.9667, 77.5667],
                        ['Third', 78.4700, 77.0300]
                      ];

          for (i = 0; i < locations.length; i++) {  
          marker = new google.maps.Marker({
      position: new google.maps.LatLng(locations[i][1], locations[i][2]),
      title: locations[i][0],map: map });
       }
  }
   google.maps.event.addDomListener(window, 'load', initialize);
  </script>

所以，请告诉我如何解决这个问题！

Answer 1

您可以将ajax与php文件一起使用，如下所示：

jQuery的：

function getLocations()
{
    $.ajax({

        type: "POST", 
        dataType: "json",
        url: "yourPhpFile.php",
        success: function(locations)
        {
            //place markers
        },
        error: function()
        {
            alert("error");
        }
    });


}

在您的PHP文件中，您应该连接到数据库->在表上执行查询（名称，长，纬度）。 以echo json_encode($yourarray);结束echo json_encode($yourarray);

“ $ yourarray”将成为ajax（JSON对象）中的“位置”。

注意：我建议您使用PDO来连接数据库（ http://php.net/manual/fr/book.pdo.php ）

Answer 2

感谢大家的答复，但我得到了答复。 我在这里张贴

<?php
error_reporting(E_ALL ^ E_DEPRECATED);

$conn = mysql_connect("localhost", "root", "") or die(mysql_error());
mysql_select_db("slcommunitydb") or die(mysql_error());
?>

<html>
<head>
 <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <title>Google Maps</title>

<!-------- Customizable Css for Map  ----------------------------->
    <style type="text/css">
        body { font: normal 10pt Helvetica, Arial; }
        #map { width: 500px; height: 300px; border: 0px; padding: 0px; }
    </style>

    <!---------------- Java Scripts for Map  ----------------->
    <script src="http://maps.google.com/maps/api/js?key=xxxxxxxxxxxxxxxx&sensor=false" 
    type="text/javascript"></script>

    <!------------- Java Scripts for Map  ------------------->
    <script type="text/javascript">

    //--------------------- Sample code written by vIr ------------
    var icon = new google.maps.MarkerImage("http://maps.google.com/mapfiles/ms/micons/blue.png",
               new google.maps.Size(32, 32), new google.maps.Point(0, 0),
               new google.maps.Point(16, 32));
                    var center = null;
                    var map = null;
                    var currentPopup;
                    var bounds = new google.maps.LatLngBounds();
                    function addMarker(lat, lng, info) {
                        var pt = new google.maps.LatLng(lat, lng);
                        bounds.extend(pt);
                        var marker = new google.maps.Marker({
                            position: pt,
                            icon: icon,
                            map: map
                        });
                        var popup = new google.maps.InfoWindow({
                            content: info,
                            maxWidth: 300
                        });
                        google.maps.event.addListener(marker, "click", function() {
                            if (currentPopup != null) {
                                currentPopup.close();
                                currentPopup = null;
                            }
                            popup.open(map, marker);
                            currentPopup = popup;
                        });
                        google.maps.event.addListener(popup, "closeclick", function() {
                            map.panTo(center);
                            currentPopup = null;
                        });
                    }           
                    function initMap() {
                        map = new google.maps.Map(document.getElementById("map"), {

                            center: new google.maps.LatLng(0, 0),
                            zoom: 14,
                            mapTypeId: google.maps.MapTypeId.ROADMAP,
                            mapTypeControl: true,
                            mapTypeControlOptions: {
                                style: google.maps.MapTypeControlStyle.HORIZONTAL_BAR
                            },
                            navigationControl: true,
                            navigationControlOptions: {
                                style: google.maps.NavigationControlStyle.ZOOM_PAN
                            }
                        });
     <?php

     $query = mysql_query("SELECT * FROM salesmapmarkers")or die(mysql_error());
    while($row = mysql_fetch_array($query))
    {
      $name = $row['name'];
      $lat = $row['lat'];
      $lon = $row['lon'];
      $desc = $row['desc'];

   echo("addMarker($lat, $lon, '<b>$name</b><br />$desc');\n");
   }
  ?>
   center = bounds.getCenter();
   map.fitBounds(bounds);

   }
   </script>

  </head>
    <body onLoad="initMap()" style="margin:0px; border:0px; padding:0px;">
       <div id="map"></div>
    </body>
 </html>

通过使用php中mysql的数据在Google地图上显示标记

问题描述

2 个解决方案

解决方案1
2 2016-07-04 09:31:21

解决方案2
2 已采纳 2016-07-04 11:03:43

通过使用php中mysql的数据在Google地图上显示标记

问题描述

2 个解决方案

解决方案1 2 2016-07-04 09:31:21

解决方案2 2 已采纳 2016-07-04 11:03:43

解决方案1
2 2016-07-04 09:31:21

解决方案2
2 已采纳 2016-07-04 11:03:43