-1

JSON 経由で取り込まれるデータがあります。正しく引き込まれており、マーカーが意図されている場所に配置されています。私が抱えている問題はgoogle.maps.event.addListener.

以下は私が持っているものです。これが正しく機能しない理由についての考え、ありがとう。

$.get('http://localhost/map/map/locations', function(result) {
    var locations = $.parseJSON(result);


    // Markers
    var markers = [];

    // Looping through the JSON data
    for (var i = 0, length = locations.length; i < length; i++) {

        var data = locations[i];

        // Creating a marker and putting it on the map
        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(data.lat, data.long),
            map: map,
            title: data.title,
            icon: iconSrc[data.category]
        });
        markers.push(marker);


        google.maps.event.addListener(marker, 'click', (function(marker, i) {
            return function() {
                infoWindow.setContent("<div class='cont_box' id='" + data.entry_id + "'> <h2>" + data.title + "</h2> <div class='cont'><p><img src='" + data.infoImage + "' alt='' width='100' height='66' style='float:right;'>" + data.windowText + "</p></div><div style='clear:both;'></div><div class='link'><a href='" + data.moreLink + "' target='_blank'>" + data.moreText + "</a></div></div>");
                infoWindow.open(map, marker);
            }
        })(marker, i));

    }// END for loop

});

アップデート

データ変数をコンテキストに追加すると、正常に機能します。

カテゴリに応じてマーカーを表示および非表示にする必要があります。多分これも似たような問題だと思います。これらの非表示機能と表示機能をデータ変数に含める最良の方法は何ですか?

機能：

    /** Shows all markers of a particular category, and ensures the checkbox is checked **/
    function show(category) {
        for (var i=0; i<locations.length; i++) {
            if (data.category == category) {
                markers[i].setVisible(true);
            }
        }
    }// END function show



    /** Hides all markers of a particular category, and ensures the checkbox is cleared **/
    function hide(category) {
        for (var i=0; i<locations.length; i++) {
            if (data.category == category) {
              markers[i].setVisible(false);
            }
        }
    }// END function hide

    /** Show or hide the categories initially **/
    show("financial_services");
    show("government");
    show("identity_access");
    show("machine_to_machine");
    show("telecommunications");
    show("transport");

    /** Action when checkbox is clicked **/
    $(".checkbox").click(function(){
        var cat = $(this).attr("value");

        // If checked
        if ( $(this).is(":checked") ){
            show(cat);
        }
        else {
            hide(cat);
        }
    });

$.get 呼び出し内にありますが、データ var を含む for ループの外にあります。

    // JSON feed
$.get('http://localhost/map/map/locations', function(result) {
    var locations = $.parseJSON(result);


    // Markers
    var markers = [];

    // Looping through the JSON data
    for (var i = 0, length = locations.length; i < length; i++) {

        var data = locations[i];

        // Creating a marker and putting it on the map
        var marker = new google.maps.Marker({
            position: new google.maps.LatLng(data.lat, data.long),
            map: map,
            title: data.title,
            icon: iconSrc[data.category]
        });
        markers.push(marker);


        google.maps.event.addListener(marker, 'click', (function(marker, i, loc) {
            return function() {
                infoWindow.setContent("<div class='cont_box' id='" + loc.entry_id + "'> <h2>" + loc.title + "</h2> <div class='cont'><p><img src='" + loc.infoImage + "' alt='' width='100' height='66' style='float:right;'>" + loc.windowText + "</p></div><div style='clear:both;'></div><div class='link'><a href='" + loc.moreLink + "' target='_blank'>" + loc.moreText + "</a></div></div>");
                infoWindow.open(map, marker);
            }
        })(marker, i, data));

    }// END for loop


    /** Shows all markers of a particular category, and ensures the checkbox is checked **/
    function show(category) {
        for (var i=0; i<locations.length; i++) {
            if (data.category == category) {
                markers[i].setVisible(true);
            }
        }
    }// END function show



    /** Hides all markers of a particular category, and ensures the checkbox is cleared **/
    function hide(category) {
        for (var i=0; i<locations.length; i++) {
            if (data.category == category) {
              markers[i].setVisible(false);
            }
        }
    }// END function hide

    /** Show or hide the categories initially **/
    show("financial_services");
    show("government");
    show("identity_access");
    show("machine_to_machine");
    show("telecommunications");
    show("transport");

    /** Action when checkbox is clicked **/
    $(".checkbox").click(function(){
        var cat = $(this).attr("value");

        // If checked
        if ( $(this).is(":checked") ){
            show(cat);
        }
        else {
            hide(cat);
        }
    });
});
4

1 に答える 1

0

addListener は新しいコンテキストを開くため、データ変数は使用できません。context に data var を追加します。

google.maps.event.addListener(marker, 'click', (function(marker, i, myData) {
    return function() {
       infoWindow.setContent("<div class='cont_box' id='" + myData.entry_id + "'> <h2>");
       infoWindow.open(map, marker);
    }
})(marker, i, data));
于 2013-02-19T17:04:47.070 に答える