1
我正在尝试加载非盈利组织的住宅物业租赁多标记。我是新来的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>