1

私は次のhtmlを持っています。

    <div class="event-details-container">
<div class="event-details">
<div class="adress">My adress</div>
<div class="arranger">My arranger</div>
<div class="title">My title</div>
<div class="date">My date</div>
</div>
<div class="event-details">
<div class="adress">My adress 2</div>
<div class="arranger">My arranger 2</div>
<div class="title">My title 2</div>
<div class="date">My date 2</div>
</div>
</div>

そして私は次のJSを持っています：

    var myMarkers = "";
$('.event-details-container .event-details').each(function (index) {
    myMarkers += "{ address: " + $(this).children(".adress").text() + ", html: " + "<div style='font-siz:14px;font-weight:bold'>" + $(this).children(".title").text() + "</div>" + $(this).children(".date").text() + "<br/>" + $(this).children(".arranger").text() + "<br/>" + $(this).children(".adress").text() + "},";
});

$(".google-map").gMap({ markers: [myMarkers.slice(0, -1)],
    address: "Washington DC, US",
    zoom: 6
});

上記のJSは、http： //gmap.nurtext.de/（jQueryのプラグイン）に基づいています。しかし、上記のコードは機能しません-マップは表示されますが、マーカーはありません-したがって、私がまとめているJsonの「文字列」に何か問題があるはずです-しかし、何ですか？

4

1 に答える 1

0

私はJavaScriptの男ではないので、誰かがこれを少しクリーンアップする必要があるかもしれません。

プラグインのドキュメントを見ると、以下を含むオブジェクトを提供する必要があります。

  • 名前の付いた文字列address
  • 名前の付いた番号zoom
  • markersを含むオブジェクトを保持するという名前の配列
    • 名前の付いた文字列address
    • 。という名前の文字列html。 

    var myMarkers = [];
$('.event-details-container .event-details').each(function (index) {
    var myHtml = "<div style='font-siz:14px;font-weight:bold'>" + 
              $(this).children(".title").text() + "</div>" + 
              $(this).children(".date").text() + "<br/>" + 
              $(this).children(".arranger").text() + "<br/>" + 
              $(this).children(".adress").text();

    myMarkers.push({ address: $(this).children(".adress").text(), html : myHtml}); 
});

var myObj = { address : "Washington, DC", zoom : 6, markers : myMarkers };

$(".google-map").gMap(myObj);

    （私はあなたが何が起こっているのかを把握できるように少し物事を壊しました）

    • 于 2011-09-18T08:37:03.033 に答える