1

v2は廃止され、私のサイトでは機能しなくなったため、Google maps API v3で遊んでいます

マップ上の xml ファイル内のすべてのポインターを表示する代わりに、そのページに関連する現在のマーカーを表示したいと考えています。イベント ページがあるので、イベントに関する情報を表示し、xml ファイルから取得したそのイベントのマップを表示したいと考えています。

URLにIDを指定する必要があることを除いて、すべて機能していますが、URLにIDが設定されていない場合はどうなりますか。

私のURLがwww.mysite.com/events.phpで、IDがないためマップが表示されないとしますが、www.mysite.com/events.php?id=1を使用するとマップが表示されます

IDがURLに含まれているかどうかを判断し、そうでない場合はxmlファイルの最後のマーカーを見つけて、代わりにそれを表示する必要があります。

これは、URLのIDが存在するかどうかを確認する追加のGoogleコードです

   function load() {
          var map = new google.maps.Map(document.getElementById("map"), {
            center: new google.maps.LatLng(50.618438, -3.420304),
            zoom: 13,
            mapTypeId: 'roadmap'
          });
          var infoWindow = new google.maps.InfoWindow;

          // Change this depending on the name of your PHP file
          downloadUrl("results.xml", function(data) {
            var xml = data.responseXML;
            var the_id = gup('id');

            var markers = xml.documentElement.getElementsByTagName("marker");
            var last = markers.length-1;

            for (var i = 0; i < markers.length; i++) {
                if (markers[i].hasAttribute('id')) {
                    //if there is, test its value
                    if (markers[i].getAttribute('id') == the_id) {
                          var name = markers[i].getAttribute("name");
                          var address = markers[i].getAttribute("address");
                          var type = markers[i].getAttribute("type");
                          var point = new google.maps.LatLng(
                              parseFloat(markers[i].getAttribute("lat")),
                              parseFloat(markers[i].getAttribute("lng")));
                          var html = "<b>" + name + "</b> <br/>" + address;
                          var icon = customIcons[type] || {};
                          var marker = new google.maps.Marker({
                            map: map,
                            position: point,
                            icon: icon.icon,
                            shadow: icon.shadow
                          });

                        bindInfoWindow(marker, map, infoWindow, html);
                     }
                     else {
                         var name = markers[last].getAttribute("name");
                          var address = markers[last].getAttribute("address");
                          var type = markers[last].getAttribute("type");
                          var point = new google.maps.LatLng(
                              parseFloat(markers[last].getAttribute("lat")),
                              parseFloat(markers[last].getAttribute("lng")));
                          var html = "<b>" + name + "</b> <br/>" + address;
                          var icon = customIcons[type] || {};
                          var marker = new google.maps.Marker({
                            map: map,
                            position: point,
                            icon: icon.icon,
                            shadow: icon.shadow
                          });

                        bindInfoWindow(marker, map, infoWindow, html);
                     }

                }
            }
          });
        }

else を追加したので、for ループの i を最後の xml マーカーに置き換える必要がありますが、機能しません。

そして、ここにURLからIDを取得する関数があります

function gup( name ) {
  name = name.replace(/[\[]/,"\\\[").replace(/[\]]/,"\\\]");
  var regexS = "[\\?&]"+name+"=([^&#]*)";
  var regex = new RegExp( regexS );
  var results = regex.exec( window.location.href );
  if( results == null )
    return "";
  else
    return results[1];
}

ID が存在するかどうかを確認する必要があると思います。存在しない場合は、最後のマーカーを取得します。

4

1 に答える 1

1

ああ...一つには、あなたの「else」句が間違ったレベルにあります（そして間違った場合に付けられます）。これは、forループ内にあるため、IDを持つすべてのマーカーに対して1回実行されます。少なくとも、elseをforループの外に移動する必要があります。

しかし、forループも不要です。マーカー要素をループして、どれが正しいIDを持っているかを確認する代わりに、次を使用しますgetElementById(id)。

 var the_id = gup('id');
 var respDoc = data.responseXML.documentElement
 var the_marker = respDoc.getElementById(the_id);
 // If the_id is '' then there will be no such marker, and the_marker will be
 // null, which is "falsy".
 if (!the_marker) {
   var markers = respDoc.getElementsByTagName("marker");
   // check whether there are any markers.
   if (markers.length < 1) return; // avoid errors
   the_marker = markers[markers.length - 1];
 }
 // Now do what you need to with the_marker.getAttribute("name") etc.
 // This is just your code, with markers[i] replaced by the_marker:
 var name = the_marker.getAttribute("name");
 var address = the_marker.getAttribute("address");
 var type = the_marker.getAttribute("type");
 var point = new google.maps.LatLng(
   parseFloat(the_marker.getAttribute("lat")),
   parseFloat(the_marker.getAttribute("lng")));
 var html = "<b>" + name + "</b> <br/>" + address;
 var icon = customIcons[type] || {};
 var marker = new google.maps.Marker({
    map: map,
    position: point,
    icon: icon.icon,
    shadow: icon.shadow
 });

 bindInfoWindow(marker, map, infoWindow, html);

（テストされていません。）

最後に、使用しているgup（）が現在のWebページのURLであるwindow.location.hrefを参照していることに気付きました。それがあなたが望むものですよね？OK、チェックするだけです...

于 2010-08-23T16:49:19.150 に答える