0

これはおそらくばかばかしいほど単純な質問です。

マーカー情報ウィンドウに次のコンテンツが表示されるマップを表示しようとしています。

名前
アドレス
概要 (つまり、説明)
URL

マーカーは、PHP を使用して mySQL データベースからクエリされます。コードは現在、すべてのマーカーを正しくマッピングしていますが、情報ウィンドウには「名前」属性しか表示されません。他の 3 つの属性を追加するために必要な不足しているコードは何ですか? (アドレス、概要、URL ?) コードのこの時点で調整が必要な部分があると思います。

          google.maps.event.addListener(marker, 'click', (function(marker, i) {
                    return function() {
                        infowindow.setContent(markers[i].getAttribute("name"));
                        infowindow.open(map, marker);
                    }
                })(marker, i));   

可能であれば、必要なスクリプトで回答してください!

- データベース出力へのライブ リンク: http://www.oaktonjapan.com/testmap/testcode3.php
**最初 (PAX コワーキング) と最後 (ベンチャー ジェネレーション) には、「アドレス、概要、および URL コンテンツが入力されていることに注意してください。
-既存の出力へのライブ リンク: http://oaktonjapan.com/testmap/testmap5.html
*
*赤い力士マーカーをクリックします.このマーカーは、正しくコーディングされている場合、4 つの属性すべてを表示する必要があります...

現在のコード:

 function load() {
  var cluster = [];
  var map = new google.maps.Map(document.getElementById("map"), {
    center: new google.maps.LatLng(35.681382,139.766084),
    zoom: 14,
    mapTypeId: 'roadmap'
  });
  var infowindow = new google.maps.InfoWindow();
    var min = .999999;
    var max = 1.000001;

  // Change this depending on the name of your PHP file
  downloadUrl("testcode3.php", function(data) {
    var xml = data.responseXML;
    var markers = xml.documentElement.getElementsByTagName("marker");
    for (var i = 0; i < markers.length; i++) {
      var name = markers[i].getAttribute("name");
      var address = markers[i].getAttribute("address");
      var type = markers[i].getAttribute("type");
      var about = markers[i].getAttribute("about");
      var url = markers[i].getAttribute("url");
      var offsetLat = markers[i].getAttribute("lat") * (Math.random() * (max - min) + min);
      var offsetLng = markers[i].getAttribute("lng") * (Math.random() * (max - min) + min);
      var point = new google.maps.LatLng(offsetLat, offsetLng);
      var html = "<b>" + name + "</b> <br/>" + address;
      var icon = customIcons[type] || {};
      var marker = new google.maps.Marker({
        map: map,
        position: point,
        icon: icon.icon,
        content: html
      });
      google.maps.event.addListener(marker, 'click', (function(marker, i) {
                    return function() {
                        infowindow.setContent(markers[i].getAttribute("name"));
                        infowindow.open(map, marker);
                    }
                })(marker, i));   
      cluster.push(marker);
    }
    var mc = new MarkerClusterer(map,cluster);
  });
}


function downloadUrl(url, callback) {
  var request = window.ActiveXObject ?
      new ActiveXObject('Microsoft.XMLHTTP') :
      new XMLHttpRequest;

  request.onreadystatechange = function() {
    if (request.readyState == 4) {
      request.onreadystatechange = doNothing;
      callback(request, request.status);
    }
  };

  request.open('GET', url, true);
  request.send(null);
}

function doNothing() {}

助けてくれてありがとう!

4

1 に答える 1

1

「html」で変数が定義されていないというエラーが発生すると思いました。

これは、xml からデータを取得する場所です。

  var name = markers[i].getAttribute("name");
  var address = markers[i].getAttribute("address");
  var type = markers[i].getAttribute("type");
  var about = markers[i].getAttribute("about");

これにより、上記で指定したリストに結合されます。

  var html = name + "<br>" + address + "<br>"+ about + "<br>" + url;

これにより、情報ウィンドウに表示されます (「content: html」がある理由はわかりませんが、少なくとも今はエラーは発生しません):

  var marker = new google.maps.Marker({
    map: map,
    position: point,
    icon: icon.icon,
    content: html
  });
  google.maps.event.addListener(marker, 'click', (function(marker, i) {
                return function() {
                    infowindow.setContent(html);
                    infowindow.open(map, marker);
                }
            })(marker, i));  
于 2012-10-04T22:51:00.470 に答える