0

Google Maps V3で複数のマーカーを表示できません。座標を正しく取得していますが、地図に表示されません。コンソールにもエラーはありません

  1. map_items[0]=タイトル
  2. map_items [1] = 55.153766、11.909180
  3. map_items[2]=リンク
  4. map_items[3]=テキスト

アラートを実行すると、それらすべてが正しく表示されます。例

"タイトル"、 "51.00150763193481、-2.5659284999999272"、 "リンク"、"テキスト"

 function initialize() {
            var map = new google.maps.Map(document.getElementById('map'), {
                zoom: 7,
                center: new google.maps.LatLng(55.153766, 11.909180),
                mapTypeId: google.maps.MapTypeId.ROADMAP
            });
            for (var x = 0; x < temp.length; x++) {
                if(temp[x][1]){
                    var map_items = temp[x];
                    var myLatlng = new google.maps.LatLng(map_items[1]);
                    var marker = new google.maps.Marker({
                        map: map,
                        position: myLatlng,
                        title: map_items[0]
                    });
                    google.maps.event.addListener(marker, 'click', function() {
                        infowindow.setContent('<div class="google_marker"><a href="'+map_items[2]+'">'+map_items[0]+'</a><br /><p>'+map_items[3]+'</p></div>');
                        infowindow.open(map, marker);
                    });
                }
            }
        }
4

3 に答える 3

7

google.maps.LatLng（）は、1つではなく、2つのパラメーターを受け取るため、次のようになります。

var latlon = map_items[1].split(',');
var myLatlng = new google.maps.LatLng(parseFloat(latlon[0]), parseFloat(latlon[1]));

ただし、実際には、各アイテムに異なるデータ型が含まれている配列ではなく、オブジェクトを使用する方が適切です。次に例を示します。

marker_data[0] = {
  "lat": 55.153766,
  "lon": 11.909180,
  "title": "My Title",
  "link": "http://stackoverflow.com"
}
//etc...

次に、次のようにアクセスします。

var myLatlng = new google.maps.LatLng(marker_data[0].lat, marker_data[0].lon);
于 2012-09-10T07:23:28.850 に答える
1

map_items[1]文字列を想定

if (temp[x][1]) {
    var map_items = temp[x];
    var latlng = map_items[1].split(",");
    var myLatlng = new google.maps.LatLng(parseFloat(latlng[0]), parseFloat(latlng[1]));
    var marker = new google.maps.Marker({
        map: map,
        position: myLatlng,
        title: map_items[0]
    });
    google.maps.event.addListener(marker, 'click', function() {
        infowindow.setContent('<div class="google_marker"><a href="' + map_items[2] + '">' + map_items[0] + '</a><br /><p>' + map_items[3] + '</p></div>');
        infowindow.open(map, marker);
    });
}
于 2012-09-10T07:27:19.593 に答える
0

マーカーをクリックすると、最後のmap_itemsのみが使用可能になると思います。別のコンテキストを作成すると、問題が解決する場合があります。

function initialize() {
                var map = new google.maps.Map(document.getElementById('map'), {
                    zoom: 7,
                    center: new google.maps.LatLng(55.153766, 11.909180),
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                });
                function AttachEventToMarker(marker, map_items){

                    google.maps.event.addListener(marker, 'click', function() {
                       infowindow.setContent('<div class="google_marker"><a href="'+map_items[2]+'">'+map_items[0]+'</a><br /><p>'+map_items[3]+'</p></div>');
                       infowindow.open(map, marker);
                    });
                }

                for (var x = 0; x < temp.length; x++) {
                    if(temp[x][1]){
                        var map_items = temp[x];
                        var myLatlng = new google.maps.LatLng(map_items[1]);
                        var marker = new google.maps.Marker({
                            map: map,
                            position: myLatlng,
                            title: map_items[0]
                        });
                         AttachEventToMarker(marker, map_items);
                    }
                }
            }
于 2012-09-10T07:36:17.930 に答える