我正在嘗試加載非盈利組織的住宅物業租賃多標記。我是新來的PHP和MySQL,所以很難弄清楚。 搜索完成後,我使用POST結果生成標記數組。我無法獲得谷歌地圖甚至加載它的空白。我已經看了很多答案,但他們總是以固定數組開始。我不知道如何從查詢中生成數組,看起來像我見過的例子,我嘗試了encode_json,但也沒有工作。底線。我需要看到幾位製造商是搜索結果並能夠點擊它們並查看房屋名稱和地址。谷歌地圖v3.0不能加載
這裏是php文件:
<?php
// get variable after selecting something from the dropdown with name 'chooser'
$select = $_POST['select'];
// if something has been chosen
if (!empty($select)) {
// get the chosen value
$community = $_POST['community'];
$location = $_POST['location'];
$start = $_POST['start'];
$maxocc = $_POST['maxocc'];
$bed = $_POST['bed'];
$fbath = $_POST['fbath'];
}
// select the type from the database
// database connection details (change to whatever you need)
$user="xxxx";
$password="xxxx";
$database="xxxxx";
// connect to database
$conn=mysql_connect ('localhost','xxxxx','xxxxx');
if (!$conn) {
die("Not connected : " . mysql_error());
}
// select database
$db_selected = mysql_select_db($database, $conn);
if (!$db_selected) {
die ("Can\'t use db : " . mysql_error());
}
// if everything successful create query
// this selects all rows where the type is the one you chose in the dropdown
// * means that it will select all columns, ie name and type as i said above
$query = "SELECT `listingdb`.`houseno`,`listingdb`.`house_name`,`listingdb`.`house_address`,`listingdb`.`lat`,`listingdb`.`long`
FROM `listingdb`
INNER JOIN `ownerdb` ON `listingdb`.`houseno`=`ownerdb`.`house_no`
WHERE start='{$_POST['start']}' OR maxocc='{$_POST['maxocc']}' OR bed='{$_POST['bed']}' OR fbath='{$_POST['fbath']}'
";
?>
.....
<script type="text/javascript">
//<![CDATA[
// initialize the google Maps
var map;
var houses = [];
var markers = [];
var infoWindow;
var locationSelect;
function initializeGoogleMap() {
// set latitude and longitude to center the map around
var corolla = new google.maps.LatLng(36.37,-75.826);
// set up the default options
var myOptions = {
zoom: 14,
center: corolla,
navigationControl: true,
navigationControlOptions:
{style: google.maps.NavigationControlStyle.DEFAULT,
position: google.maps.ControlPosition.TOP_LEFT },
mapTypeControl: false,
mapTypeControlOptions:
{style: google.maps.MapTypeControlStyle.DEFAULT,
position: google.maps.ControlPosition.TOP_RIGHT },
scaleControl: true,
scaleControlOptions: {
position: google.maps.ControlPosition.BOTTOM_LEFT
},
mapTypeId: google.maps.MapTypeId.ROADMAP,
draggable: true,
disableDoubleClickZoom: false,
keyboardShortcuts: true
}
var map = new google.maps.Map(document.getElementById("mapCanvas"), myOptions);
var infoWindow = new google.maps.InfoWindow;
<?php
$mymap = array();
$result = mysql_query ($query);
while($row = mysql_fetch_array ($result))
{
$coordinates = array(
'latitude' => $row['lat'],
'longitude' => $row['long'],
'house_name' => $row['house_name'],
'house_address' => $row['house_address'],
);
array_push($mymap, $coordinates);
}
$houses[] = $mymap;
print_r ($houses[0]);
for($i=0; $i < count($houses[0]); $i++) {
{
?>
// Add a marker to the map at specified latitude and longitude with tooltip
function createMarker(map,lat,lng,title,html) {
for (var i = 0; i <houses.length; i++) {
var point = point[i]
var myLatLng = new google.maps.LatLng(<?php echo $houses[0][$i]['latitude']; ?>,<?php echo $houses[0][$i]['longitude']; ?>);
var html = "<b>" + <?php echo $houses[0][$i]['house_name']; ?> + "</b> <br/>" + <?php echo $houses[0][$i]['house_address']; ?>;
var icon = "",
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: "<?php echo $houses[0][$i]['house_name']; ?>",
icon: "",
});
bindInfoWindow(marker, map, infoWindow, html);
}
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
markers.push(marker);
<?php }} ?>
}
// To add the marker to the map, call setMap();
marker.setMap(map);
}
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
}
//]]>
</script>
</head>
<body onLoad="load()">
查看源文件看起來是這樣的:
<script type="text/javascript">
//<![CDATA[
var map;
var houses = [];
var markers = [];
var infoWindow;
var locationSelect;
function initializeGoogleMap() {
// set latitude and longitude to center the map around
var corolla = new google.maps.LatLng(36.37,-75.826);
// set up the default options
var myOptions = {
zoom: 14,
center: corolla,
navigationControl: true,
navigationControlOptions:
{style: google.maps.NavigationControlStyle.DEFAULT,
position: google.maps.ControlPosition.TOP_LEFT },
mapTypeControl: false,
mapTypeControlOptions:
{style: google.maps.MapTypeControlStyle.DEFAULT,
position: google.maps.ControlPosition.TOP_RIGHT },
scaleControl: true,
scaleControlOptions: {
position: google.maps.ControlPosition.BOTTOM_LEFT
},
mapTypeId: google.maps.MapTypeId.ROADMAP,
draggable: true,
disableDoubleClickZoom: false,
keyboardShortcuts: true
}
var map = new google.maps.Map(document.getElementById("mapCanvas"), myOptions);
var infoWindow = new google.maps.InfoWindow;
Array
(
[0] => Array
(
[latitude] => 36.370525
[longitude] => -75.827683
[house_name] => Barefoot Days
[house_address] => 1140 Morris Dr.
)
[1] => Array
(
[latitude] => 36.364495
[longitude] => -75.827469
[house_name] => Celestial Haven
[house_address] => 1043 Miller Court
)
[2] => Array
(
[latitude] => 36.360832
[longitude] => -75.825645
[house_name] => Seehorses
[house_address] => 1030 Mirage St.
)
[3] => Array
(
[latitude] => 36.370992
[longitude] => -75.825366
[house_name] => Summer Dreams
[house_address] => 1121 Ocracoke Court
)
[4] => Array
(
[latitude] => 36.370266
[longitude] => -75.825924
[house_name] => Beachy Keen
[house_address] => 1125 Morris Dr.
)
[5] => Array
(
[latitude] => 36.369402
[longitude] => -75.828155
[house_name] => The Surfrider
[house_address] => 1103 Austin St.
)
[6] => Array
(
[latitude] => 36.366102
[longitude] => -75.826353
[house_name] => Beacon of Light
[house_address] => 1067 Beacon Hill Dr.
)
)
// Add a marker to the map at specified latitude and longitude with tooltip
function createMarker(map,lat,lng,title,html) {
for (var i = 0; i <houses.length; i++) {
var point = point[i]
var myLatLng = new google.maps.LatLng(36.370525,-75.827683);
var html = "<b>" + Barefoot Days + "</b> <br/>" + 1140 Morris Dr.;
var icon = "",
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: "Barefoot Days",
icon: "",
});
bindInfoWindow(marker, map, infoWindow, html);
}
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
markers.push(marker);
// Add a marker to the map at specified latitude and longitude with tooltip
function createMarker(map,lat,lng,title,html) {
for (var i = 0; i <houses.length; i++) {
var point = point[i]
var myLatLng = new google.maps.LatLng(36.364495,-75.827469);
var html = "<b>" + Celestial Haven + "</b> <br/>" + 1043 Miller Court;
var icon = "",
var marker = new google.maps.Marker({
position: myLatLng,
map: map,
title: "Celestial Haven",
icon: "",
});
bindInfoWindow(marker, map, infoWindow, html);
}
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
markers.push(marker);
you see all the markers (i deleted them for your reference, you get the picture
....
// To add the marker to the map, call setMap();
marker.setMap(map);
}
function bindInfoWindow(marker, map, infoWindow, html) {
google.maps.event.addListener(marker, 'click', function() {
infoWindow.setContent(html);
infoWindow.open(map, marker);
});
}
//]]>
</script>