0

たくさんのマーカーが付いたグーグルマップがあります（MySQLデータベースから収集）。現在、次のコードを使用して、マーカーがクリックされたときにマーカーのアイコンを変更しています。

var redbikeicon = "images/bike_red.png";

<?php
    $result=mysql_query("select * from sites") or die(mysql_error());
    while($row=mysql_fetch_assoc($result)){
        ?>
        marker = new google.maps.Marker({
        position: new google.maps.LatLng(<?php echo $row['Latitude']; ?>, <?php echo $row['Longitude']; ?>),
        map: map, icon: bikeicon});

        //add event to every marker
        google.maps.event.addListener(marker, 'click', function(){
            //change icon color
            this.setIcon(redbikeicon);      //replace default icon with red version (color-marking all chosen markers)

        })
        <?php
    }
    ?>

このコードは正常に機能しますが、ページ上のリンクがクリックされたときに同じことを実行する必要があります。マップの横のページにリンクのリストがあり、それぞれがマップ上のマーカーの1つに対応しています。 。リンクがクリックされると、対応するマーカーは、マーカー自体がクリックされたときと同じように色が変わるはずです。どうすればこれを達成できますか？

4

2 に答える 2

8

ホバーを使用することを除いて、私は似たようなことをします。以下のクリックに変更しました。これにもjQueryを使用しています。とにかく、リンクにクリックイベントを設定します。リンクには、「record_id」とも呼ばれるマーカーに設定したプロパティに対応する「record_id」という属性があります。

リンクがクリックされたら、ID を取得し、一致するマーカーが見つかるまですべてのマーカーを反復処理してから、googlemaps API で提供されている setIcon メソッドを使用してアイコンを変更します。

それが役立つことを願っています。

ID の設定:

marker = new google.maps.Marker({
    record_id: record_id,
    position: point,
    map: map,
    title: name,
    icon: 'http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=whatever|BDD73C|000000'
});

アンカーでのアクションの設定:

$("a.whatever").click(function(){
    var id = $(this).attr('id');
    changeMarker(id);                             
});

setIcon を使用して、アイコンを別の色に交換します。

function changeMarker(record_id){
    for (i in Markers){
        if(Markers[i].record_id == record_id){
            Markers[i].setIcon('http://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=title|EC2A8C|000000');
        }
    }
}
于 2013-01-25T15:29:47.267 に答える
2

リンクがクリックされたときに、マーカーで「クリック」イベントをトリガーします。

google.maps.event.trigger(gmarkers[i], "click");

クリック可能な動的サイドバーの例(クリック リスナーは情報ウィンドウを開きます)

于 2013-01-25T15:36:13.777 に答える