php - google dynamic marker of maps -
what want is:
when select on combo box item, items database , show marker have select . doesn't work. here code:
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 dabatase: '.mysql_error(); }else{ db_select(); } $string="select count(province_id) c 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 depending on name of php file gdownloadurl("phpsqlajax_genxml.php", function(data) { var xml = gxml.parse(data); var markers = xml.documentelement.getelementsbytagname("marker"); (var = 0; < 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 marker 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 depending on name of php file gdownloadurl("phpajax_get_uniq_province.php", function(data) { var xml = gxml.parse(data); var markers = xml.documentelement.getelementsbytagname("marker"); (var = 0; < 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 * 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 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 forum: <?php echo $_session['sum'];?></div> </td></tr> <tr><td> <div class="detail_container"> <!-- city details --> <div class="city_detail"> <!-- city --> <h3>choose 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 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 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 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 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) c tbl_cep_forum inner join tbl_cep_province on tbl_cep_province.id = tbl_cep_forum.province_id 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
<?php require("database/connect_conf.php"); if(!connection()){ echo 'not connect: '.mysql_error(); }else{ connection(); } if(!db_select()){ echo 'not connect dabatase: '.mysql_error(); }else{ db_select(); } if (isset($_post['continent'])){ $name=$_post['continent']; ?> <script type="text/javascript">alert('the post name 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 connection mysql server //include("images/template/dots.png"); // select rows in markers table $query = "select * markers 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 rows, printing xml nodes each while ($row = @mysql_fetch_assoc($result)){ // add 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 post');</script> <?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 connection mysql server //include("images/template/dots.png"); if(!connection()){ echo 'not connect: '.mysql_error(); }else{ connection(); } if(!db_select()){ echo 'not connect dabatase: '.mysql_error(); }else{ db_select(); } // select rows in markers table $query = "select * markers 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 rows, printing xml nodes each while ($row = @mysql_fetch_assoc($result)){ // add 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>'; ?>
your first drama may calling same php script, through jquery, using $.load() function , $.post() function:
$('#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 first of many issues. need cut code pieces, run them independently, using firebug or similar view interactions, , combine prove each segment error-free.
Comments
Post a Comment