Filtrare risultati Google Maps

giggi91

Nuovo Utente
10 Lug 2013
4
0
0
Salve ragazzi avrei un piccolo problemino.
In pratica ho due select create tramite ajax; le select in questione sono Regione e Provincia. Se un'utente seleziona ad esempio Lazio come Regione e Roma come Provincia, vengono visualizzati i negozi presenti nella città di Roma, i quali sono presi direttamente dal mio database mysql. Per rendere il tutto più performante ho inserito la mappa dell'italia con Google Maps e i marker vengono estrapolati tutti dal database. Ora vorrei però fare in modo di filtrare la mappa, ovvero se un'utente sceglie di visualizzare i negozi di Roma i marker dovrebbero scomparire tutti lasciando il posto solo a quelli localizzati su tale città.
Di seguito vi posto i file che ho utilizzato che, anche se i marker non vengono aggiornati, potrebbero comunque essere utili a chi cerca di realizzare qualcosa del genere.

Questa è la mia pagina html

Codice:
<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&v=2&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 miatable"; //selezioni latitudine e longitudine
     $result1 = mysql_query($exe1, $db)or die(mysql_error());  //estraggo i risultati
     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"; //stampo i risultati con un ciclo loop
    }
?> 

}
    }

    </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>
La classe option.class.php

Codice:
<?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>';
        }
il file result.php

Codice:
<?php
include_once 'option.class.php';
$obj = new Option();
$obj->ShowResult();
?>
il file selection.php

Codice:
<?php
include_once 'option.class.php';
$obj = new Option();
$obj->ShowProvincia();
?>
Qualsiasi aiuto è altamente apprezzato. Grazie in Anticipo