гугл динамический маркер карт - PullRequest
Новая
       2

гугл динамический маркер карт

0 голосов
/ 12 апреля 2011

что я хочу сделать, это:
когда я выбираю в поле со списком, получить элементы из базы данных и показать все маркеры, где у меня есть выбор. но это не работает Вот мой код:

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 

    <?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('<','&lt;',$htmlStr); 
$xmlStr=str_replace('>','&gt;',$xmlStr); 
$xmlStr=str_replace('"','&quot;',$xmlStr); 
$xmlStr=str_replace("'",'&#39;',$xmlStr); 
$xmlStr=str_replace("&",'&amp;',$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 

    <?php
    require("database/connect_conf.php");

    function parseToXML($htmlStr) 
    { 
    $xmlStr=str_replace('<','&lt;',$htmlStr); 
    $xmlStr=str_replace('>','&gt;',$xmlStr); 
    $xmlStr=str_replace('"','&quot;',$xmlStr); 
    $xmlStr=str_replace("'",'&#39;',$xmlStr); 
    $xmlStr=str_replace("&",'&amp;',$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 Ответ

0 голосов
/ 12 апреля 2011

Ваша первая драма может заключаться в том, что вы вызываете один и тот же скрипт PHP через jQuery, используя функцию $.load() и функцию $.post(): 

$('#t2').load('phpajax_get_uniq_province.php').show();
var get_name=$('#continent').val();
$.post('phpajax_get_uniq_province.php', { continent: get_name },

У меня мало сомнений, что это первыйиз многих вопросов.Вам действительно нужно разрезать код на части, запускать их независимо друг от друга, используя Firebug или аналогичный инструмент для просмотра взаимодействий, а затем объединять его, пока вы доказываете, что каждый сегмент безошибочен.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...