我有lng/lat值存储在mysql中，并试图在谷歌地图上显示它们…
<?php
require ('db_info.php');
$connection = mysql_connect($server, $username, $password);
$db_selected = mysql_select_db($database, $connection);
?>
<html lang="en">
{% include 'components/head.html' %}
<body>
<div id = "wrapper">
{% include 'components/nav-account.html' %}
<div id = "page-wrapper">
{% include 'components/alerts.html' %}
<div class = "container">
<style type = "text/css">
html, body, #map-canvas{ height:100%;
margin:0;
padding:0;
}
</style>
<script type = "text/javascript"
src = "https://maps.googleapis.com/maps/api/js?
key=AIzaSyB76xBqfQdgOLV77VK3JZ09vWwk8brkMFs">
</script>
<script type="text/javascript">
function addMarker(lat, lng){
var pt = new google.maps.LatLng(lat, lng);
var marker = new google.maps.Marker({
position: pt,
map: map
});
}
function initialize() {
var mapOptions = {
center: {lat: 54.872128, lng: -6.284874},
zoom: 15
};
var map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
}
google.maps.event.addDomListener(window, 'load', initialize);
<?php
$query = mysql_query("select * from tester") or die(mysql_error());
while($row = mysql_fetch_array($query)){
$lat = $row['lat'];
$lng = $row['lng'];
echo ("addMarker($lat, $lng)");
}
?>
</script>
<div id="map-canvas" style="height:600px; width:600px;
margin-top:100px; margin-bottom: 100px;
">
</div>
</div>
{% include 'components/footer.html' %}
</div>
</div>
</body>
</html>
当前地图没有显示，但它是在我试图从数据库检索信息之前。任何帮助将非常感激!
您需要将addMarker调用移动到初始化函数内部。在初始化调用之前，没有映射，因此无法添加标记符。
我没有检查你的代码语法。你还需要一个全局javascript变量map…Var map = null;这需要在初始化调用之外，然后将var map丢弃在内部，而只使用map =
<?php
require ('db_info.php');
$connection = mysql_connect($server, $username, $password);
$db_selected = mysql_select_db($database, $connection);
?>
<html lang="en">
{% include 'components/head.html' %}
<body>
<div id = "wrapper">
{% include 'components/nav-account.html' %}
<div id = "page-wrapper">
{% include 'components/alerts.html' %}
<div class = "container">
<style type = "text/css">
html, body, #map-canvas{ height:100%;
margin:0;
padding:0;
}
</style>
<script type = "text/javascript"
src = "https://maps.googleapis.com/maps/api/js?
key=AIzaSyB76xBqfQdgOLV77VK3JZ09vWwk8brkMFs">
</script>
<script type="text/javascript">
var map = null;
function addMarker(lat, lng){
var pt = new google.maps.LatLng(lat, lng);
var marker = new google.maps.Marker({
position: pt,
map: map
});
}
function initialize() {
var mapOptions = {
center: {lat: 54.872128, lng: -6.284874},
zoom: 15
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
<?php
$query = mysql_query("select * from tester") or die(mysql_error());
while($row = mysql_fetch_array($query)){
$lat = $row['lat'];
$lng = $row['lng'];
echo "addMarker($lat, $lng);";
}
?>
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
<div id="map-canvas" style="height:600px; width:600px;
margin-top:100px; margin-bottom: 100px;
">
</div>
</div>
{% include 'components/footer.html' %}
</div>
</div>
</body>