使用下拉菜单过滤Google地图地图

时间:2013-08-26 14:16:25

标签: php google-maps jquery google-maps-markers

我有一个从数据库表生成的Google Maps地图。我想在两个选项的帮助下过滤标记:Regione和Provincia,它们是在Ajax中制作的。

我的页面:

<head>
    <script type="text/javascript" src="jquery-1.3.2.js"></script>
<script type="text/javascript">
jQuery(document).ready(function() {

jQuery('#sel_regione').change(function(){



            var cont = jQuery('#sel_regione').attr('value');
            jQuery.post("selection.php", {regione_id:cont}, function(data){
            jQuery("#sel_provincia").empty();
            jQuery("div#result").empty();
            jQuery("#sel_provincia").prepend(data);
            });
            });

jQuery('#sel_provincia').change(function(){

            var id_naz = jQuery('#sel_provincia').attr('value');

            jQuery.post("result.php", {provincia_id:id_naz}, function(data){
            jQuery("div#result").empty();
            jQuery("div#result").prepend(data);
            });
            });

});
</script>
<?php $db = mysql_connect("miodb","user","pass");
     mysql_select_db("dbname", $db); ?>

    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=APIKEY" type="text/javascript"></script>
<script type="text/javascript">

var mioMarker = new google.maps.Marker({

                    map: map,
                    icon: mioLogo,
                    title:"mioTitle"
            });

    function createMarker(point,html) {

        var marker = new GMarker(point);
       GEvent.addListener(marker,"click",function(){ top.location = "#" }); 
       return marker;
      }


        function initialize() {
        if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map_canvas"),{ size: new GSize(580,400) } );
        map.removeMapType(G_HYBRID_MAP);
        map.setCenter(new GLatLng(43.036776,12.45758,0), 1);
                map.setZoom(5);
        var mapControl = new GMapTypeControl();
        map.addControl(mapControl);
        map.addControl(new GLargeMapControl());




 <?  $exe1="SELECT lat,lng FROM mytable";
     $result1 = mysql_query($exe1, $db)or die(mysql_error());  
     while(list($lat,$long) = mysql_fetch_row($result1)){ 

            echo "\n var point = new GLatLng(".$lat.",".$long.");\n";
            echo "var marker = createMarker(point,'');\n";
            echo "map.addOverlay(marker);\n";
            echo "\n";
    }
?> 

}
    }

    </script>
</head>
<body onload="initialize()" onunload="GUnload()">
<div id="regione">
<?php
include_once 'option.class.php';
$obj = new Option();
$obj->ShowRegione();
?>
</div>

<div id="provincia">
Seleziona una provincia:<br>
<select id="sel_provincia" name="sel_provincia"><option value="no">Scegli...</option>
</select>
</div>

<div id="result">


</div>

        <div id="map_canvas" style="width: 580px; height: 300px"></div> 
</body>

option.class.php

<?php
class Option
{
    public $conn;

        public function __construct()
        {
            $this->DbConnectAndSelect();
        }

        protected function DbConnectAndSelect()
        {
            include_once "db_config.php";
            $this->conn = mysql_connect($db_host,$username,$password);
            mysql_select_db($db_name, $this->conn);
            return TRUE;
        }

        public function ShowRegione()
        {
            echo 'Seleziona una regione:<br>';
            echo '<select id="sel_regione" name="sel_regione"><option value="no">Scegli...</option>';

            $sql = "SELECT * FROM table_regione";
            $res = mysql_query($sql,$this->conn);

                while($row = mysql_fetch_array($res))
                {
                    echo '<option value="' . $row['regione_id'] . '">' . $row['nome'] . '</option>';
                }

            echo '</select>';
        }

        public function ShowProvincia()
        {
            if($_POST['regione_id'] == "no")
            {
                die;
            }


            $sql = "SELECT * FROM table_provincia WHERE regione_id=$_POST[regione_id]";
            $res = mysql_query($sql,$this->conn);
                echo'<option value="no">Scegli...</option>';
                while($row = mysql_fetch_array($res))
                {
                    echo '<option value="' . $row['provincia_id'] . '">' . $row['nome'] . '</option>';
                }


        }

        public function ShowResult()
        {
                        $query = "SELECT * FROM miaTable WHERE provincia_id=$_POST[provincia_id]";
                        $risultati=mysql_query($query);
                        $num=mysql_numrows($risultati);
                        if ($num == 0)
                         {
                            echo "<br><br> No records found";
                         }
            else
                        {
            echo '<br><br>Trovati i seguenti record: <br> ';
                        $i=0;
                        while ($i < $num) {

                         $denominazione=mysql_result($risultati,$i,"denominazione");
                         $indirizzo=mysql_result($risultati,$i,"indirizzo");

     echo "<b>$denominazione</b><br>$indirizzo<br><br>";

     $i++;

                        }
                        }
        }
}

?>

file result.php

<?php
include_once 'option.class.php';
$obj = new Option();
$obj->ShowResult();
?>

文件selection.php

<?php
include_once 'option.class.php';
$obj = new Option();
$obj->ShowProvincia();
?>

我是怎么做到的?任何帮助都非常感谢!

0 个答案:

没有答案