谷歌地图动态标记
[英]google dynamic marker of maps
问题描述
what i want to do is: 
我想做的是：
when i select on combo box item, get items from database and show all marker where i have select . 当我在组合框项目上选择时，从数据库中获取项目并显示所有标记。 but it doesn't work. 但这不起作用。 Here are my code: 这是我的代码：
index.php index.php
<?php
session_start();
$_SESSION['sum']=0;
include("database/connect_conf.php");
if(!connection()){
echo 'Not connect: '.mysql_error();
}else{
connection();
}
if(!db_select()){
echo 'Not connect to Dabatase: '.mysql_error();
}else{
db_select();
}
$string="SELECT count(province_id) AS c FROM tbl_cep_forum";
$get_result=mysql_query($string);
if($get_result){
$j=1;
while($value=mysql_fetch_array($get_result)){
$_SESSION['sum']=$_SESSION['sum']+$value['c'];
$j++;
}
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps AJAX + mySQL/PHP Example</title>
<script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAR0TWf73rulOP_SnETQPFKxRj5djmSsmVAgDaRb1psFcJlThRhxSjxifqM96NjrBsBn2XrZWSE-QQqQ"
type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="includes/style_map.css" />
<script type="text/javascript" src="includes/jquery-1.5.min.js"></script>
<script type="text/javascript" src="includes/interactive_map.js"></script>
<script type="text/javascript" src="includes/js_map.js"></script>
<script type="text/ecmascript" src="includes/ajax_google.js"></script>
<script type="text/javascript">
//<![CDATA[
var iconRed = new GIcon();
iconRed.image = 'http://labs.google.com/ridefinder/images/mm_20_red.png';
iconRed.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
iconRed.iconSize = new GSize(12, 20);
iconRed.shadowSize = new GSize(22, 20);
iconRed.iconAnchor = new GPoint(6, 20);
iconRed.infoWindowAnchor = new GPoint(5, 1);
var customIcons= iconRed;
function load() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(12.5, 104.98386), 7);
// Change this depending on the name of your PHP file
GDownloadUrl("phpsqlajax_genxml.php", function(data) {
var xml = GXml.parse(data);
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
// var pro_id=markers[i].getAttribute("id");
var name = markers[i].getAttribute("name");
var type = markers[i].getAttribute("type");
var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var address = markers[i].getAttribute("address");
var description = markers[i].getAttribute("description");
var marker = createMarker(point, name, address, type,name,description);
// marker.url='http://www.jaukjey.com';
map.addOverlay(marker);
}
});
}
}
function createMarker(point, name, address, type,id,description) {
var marker = new GMarker(point, customIcons);
var html_a = "<b>" + name + "</b> <br/>"+ type;
// var html = "<b>" + name + "</b> <br/>" + type;
GEvent.addListener(marker, 'click', function() {
// window.location.href = marker.url;
var imag_info='<img class="city_photo" src="images/cities/sydney.jpg" alt="sydney" width="75" height="75" />';
var sideHtml='<div class="city_info"><div id="'+name+'" class="dot" continent="'+name+'">'+imag_info+'<br><b>Addres:</b></br><h2>Province Name:....</h2><br></br>'+description+'</div></div>';
$('.detail_container').fadeOut(500,function(){
$('.detail_container .city_detail').html(sideHtml);
$(".detail_container").fadeIn(500);
})
// $(".city_detail").html(sideHtml);
var div=document.getElementById(id);
marker.openInfoWindowHtml(html_a);
});
return marker;
}
/*function Get marker by province*/
function phpajax_get_Province(){
$('#t2').load('phpajax_get_uniq_province.php').show();
var get_name=$('#continent').val();
$.post('phpajax_get_uniq_province.php', { continent: get_name },
function(return_data){
$('#t2').html(return_data).show();
});
alert('Province name is: '+ get_name);
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map"));
map.addControl(new GSmallMapControl());
map.addControl(new GMapTypeControl());
map.setCenter(new GLatLng(12.5, 104.98386), 7);
// Change this depending on the name of your PHP file
GDownloadUrl("phpajax_get_uniq_province.php", function(data) {
var xml = GXml.parse(data);
var markers = xml.documentElement.getElementsByTagName("marker");
for (var i = 0; i < markers.length; i++) {
// var pro_id=markers[i].getAttribute("id");
var name = markers[i].getAttribute("name");
var type = markers[i].getAttribute("type");
var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
parseFloat(markers[i].getAttribute("lng")));
var address = markers[i].getAttribute("address");
var description = markers[i].getAttribute("description");
var marker = createMarker(point, name, address, type,name,description);
map.addOverlay(marker);
//alert('Has reloded!'+ name+"<br></br>"+ type);
}
});
}
}
</script>
</head>
<body onload="load()" onunload="GUnload()" bgcolor="#99b3cc">
<div id="menu_title"><a href="">Forum</a><a href="">Training</a></div>
<div class="map_contianer">
<div id="map" style="width: 600px; height: 500px;"></div>
<!-- Form -->
<form id="mapForm" name="mapForm" class="form_continent" method="post" action="">
<select name="continent" id="continent" onchange="javascript:phpajax_get_Province();">
<?php
$str="select * from tbl_cep_province";
$result=mysql_query($str);
if($result){
$i=1;
while($value=mysql_fetch_array($result)){
?>
<option value="<?php echo $value['id'];?>">
<?php echo $value['name'];?>
</option>
<?php }
$i++;
}else{echo 'Can not select table number.';}?>
<option value="ALL" selected="selected">Show all provinces</option>
</select>
</form>
<table class="collape_main_contianer" border="0">
<tr><td class="list_event_province">
<div style="background-color:#00F; padding-left:5px; font-size:18px; font-weight:bold;">All Medias</div>
<ul>
<li><a href="">Download Video</a></li>
<li><a href="">Download Audio</a></li>
</ul>
<div style="background-color:#00F; padding-left:5px; font-size:18px; font-weight:bold;">Total All Forum: <?php echo $_SESSION['sum'];?></div>
</td></tr>
<tr><td>
<div class="detail_container">
<!-- City details -->
<div class="city_detail">
<!-- City -->
<h3>Choose a province</h3>
<p>Pellentesque nibh felis, eleifend id, commodo in, interdum vitae, leo. Praesent eu elit. Ut eu ligula.</p>
<p>Curabitur fringilla. Nunc est ipsum, pretium quis, dapibus sed, varius non, lectus. Proin a quam.</p>
<p>Pellentesque nibh felis, eleifend id, commodo in, interdum vitae, leo. Praesent eu elit. Ut eu ligula.</p>
<p>Curabitur fringilla. Nunc est ipsum, pretium quis, dapibus sed, varius non, lectus. Proin a quam.</p>
<p>Pellentesque nibh felis, eleifend id, commodo in, interdum vitae, leo. Praesent eu elit. Ut eu ligula.</p>
<p>Curabitur fringilla. Nunc est ipsum, pretium quis, dapibus sed, varius non, lectus. Proin a quam.</p>
</div>
</div>
</td></tr>
</table>
</div>
<div id="t2">return value here</div>
<div id="left_content"><p class="grey" align="justify">
<?php
$str="SELECT tbl_cep_province.id,tbl_cep_province.name FROM tbl_cep_province";
$result=mysql_query($str);
if($result){
$i=1;
while($get_values=mysql_fetch_array($result)){
//$_SESSION['name_province']=$values['id'];
$string="SELECT tbl_cep_province.name,count(province_id) AS c
FROM tbl_cep_forum
INNER JOIN tbl_cep_province ON tbl_cep_province.id = tbl_cep_forum.province_id
WHERE tbl_cep_forum.province_id='".$get_values['id']."'";
$get_result=mysql_query($string);
if($get_result){
$j=1;
while($value=mysql_fetch_array($get_result)){?>
<table cellpadding="0" cellspacing="1">
<tr bgcolor="#ECECEC" onMouseOver="this.style.backgroundColor='transparent'" onMouseOut="this.style.backgroundColor='#ECECEC'">
<td style="width:150px; float:left; padding-left:10px;"><?php echo $value['name'];?></td><td style="padding-left:10px; width:30px; float:left;"><?php echo $value['c'];?></td></tr>
</table>
<?php
$j++;
}
}
$i++;
}
}
?>
</p>
</div>
<div class="city_detail_container">
<!-- City -->
<div class="city_detail" id="sydney">
<img class="city_photo" src="images/cities/sydney.jpg" alt="sydney" width="75" height="75" />
<div class="city_info">
<h2>Sydney 123</h2>
<h3>Australia</h3>
<p>Pellentesque nibh felis, eleifend id, commodo in, interdum vitae, leo. Praesent eu elit. Ut eu ligula. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos commodo in interdum vitae leo.</p>
</div>
</div>
<div class="clear_both"></div>
</div><!--close city_detail_container-->
</div><!--Close map_container-->
</body>
</html>
phpajax_get_uniq_province.php phpajax_get_uniq_province.php
<?php
require("database/connect_conf.php");
if(!connection()){
echo 'Not connect: '.mysql_error();
}else{
connection();
}
if(!db_select()){
echo 'Not connect to Dabatase: '.mysql_error();
}else{
db_select();
}
if (isset($_POST['continent'])){
$name=$_POST['continent'];
?>
<script type="text/javascript">alert('The post name is set!');</script>
<?php
function parseToXML($htmlStr)
{
$xmlStr=str_replace('<','<',$htmlStr);
$xmlStr=str_replace('>','>',$xmlStr);
$xmlStr=str_replace('"','"',$xmlStr);
$xmlStr=str_replace("'",''',$xmlStr);
$xmlStr=str_replace("&",'&',$xmlStr);
return $xmlStr;
}
// Opens a connection to a MySQL server
//include("images/template/dots.png");
// Select all the rows in the markers table
$query = "SELECT * FROM markers WHERE name='$name'";
$result = mysql_query($query);
if (!$result) {
die('Invalid query: ' . mysql_error());
}
header("Content-type: text/xml");
// Start XML file, echo parent node
echo '<markers>';
// Iterate through the rows, printing XML nodes for each
while ($row = @mysql_fetch_assoc($result)){
// ADD TO XML DOCUMENT NODE
echo '<marker ';
echo 'name="' . parseToXML($row['name']) . '" ';
echo 'address="' . parseToXML($row['address']) . '" ';
echo 'description="' . parseToXML($row['description']) . '" ';
echo 'lat="' . $row['lat'] . '" ';
echo 'lng="' . $row['lng'] . '" ';
echo 'type="' . $row['type'] . '" ';
echo '/>';
}
// End XML file
echo '</markers>';
}else{
?>
<script type="text/javascript">alert('Can not get post');</script>
<?php
}
?>
phpsqlajax_genxml.php phpsqlajax_genxml.php
<?php
require("database/connect_conf.php");
function parseToXML($htmlStr)
{
$xmlStr=str_replace('<','<',$htmlStr);
$xmlStr=str_replace('>','>',$xmlStr);
$xmlStr=str_replace('"','"',$xmlStr);
$xmlStr=str_replace("'",''',$xmlStr);
$xmlStr=str_replace("&",'&',$xmlStr);
return $xmlStr;
}
// Opens a connection to a MySQL server
//include("images/template/dots.png");
if(!connection()){
echo 'Not connect: '.mysql_error();
}else{
connection();
}
if(!db_select()){
echo 'Not connect to Dabatase: '.mysql_error();
}else{
db_select();
}
// Select all the rows in the markers table
$query = "SELECT * FROM markers WHERE 1";
$result = mysql_query($query);
if (!$result) {
die('Invalid query: ' . mysql_error());
}
header("Content-type: text/xml");
// Start XML file, echo parent node
echo '<markers>';
// Iterate through the rows, printing XML nodes for each
while ($row = @mysql_fetch_assoc($result)){
// ADD TO XML DOCUMENT NODE
echo '<marker ';
echo 'name="' . parseToXML($row['name']) . '" ';
echo 'address="' . parseToXML($row['address']) . '" ';
echo 'description="' . parseToXML($row['description']) . '" ';
echo 'lat="' . $row['lat'] . '" ';
echo 'lng="' . $row['lng'] . '" ';
echo 'type="' . $row['type'] . '" ';
echo '/>';
}
// End XML file
echo '</markers>';
?>
1 个解决方案
解决方案1
0 2011-04-12 07:47:22
Your first drama may be that you are calling the same PHP script, through jQuery, using the $.load() function and the $.post() function: 您的第一部戏可能是您正在使用$.load()函数和$.post()函数通过jQuery调用相同的PHP脚本：
$('#t2').load('phpajax_get_uniq_province.php').show();
var get_name=$('#continent').val();
$.post('phpajax_get_uniq_province.php', { continent: get_name },
I have little doubt that is the first of many issues. 我毫不怀疑这是许多问题中的第一个。 You really do need to cut the code into pieces, run them independently, using Firebug or similar to view the interactions, and then combine it as you prove each segment as error-free. 您确实确实需要将代码切成碎片，使用Firebug或类似工具独立运行它们，以查看交互，然后在证明每个段都没有错误的情况下将其组合。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
Google Maps API标记 - Google maps API Marker
Google地图标记网址？ - Google Maps Marker URL?
谷歌地图标记信息窗口 - Google maps marker infowindow
在Google地图上显示标记 - Display marker to google maps
谷歌地图标记选择 - Google Maps Marker Selection
Google Maps API-标记未显示 - Google Maps API - Marker not showing
移动多个标记的谷歌地图？ - move multiple marker google maps?
Google地图未加载图像和标记 - Google Maps Not Loading Image and Marker
Google Maps Multi Marker不起作用 - Google Maps Multi Marker not working
Google Maps API-标记，MySQL - Google Maps API - Marker, MySQL
相关标签