0

this.$map理由を理解するのに苦労していて、this.markers未定義です。これが私が使用しているコードであり、これらの変数が値を提供することを期待するコメントを追加しました：

(function($) {
    'use strict';

    var A = {

        /**
         * Initialize the A object
         */
        init: function() {
            this.$map = this.renderMap();
            this.markers = this.getMarkers();

            this.renderMarkers();
        },

        renderMap: function() {

            var url = 'http://a.tiles.mapbox.com/v3/delewis.map-i3eukewg.jsonp';

            // Get metadata about the map from MapBox
            wax.tilejson(url, function(tilejson) {
                var map = new L.Map('map', {zoomControl: false});

                var ma = new L.LatLng(42.2625, -71.8028);

                map.setView(ma, 8);

                // Add MapBox Streets as a base layer
                map.addLayer(new wax.leaf.connector(tilejson));

                return function() {
                    return map;
                };
            });
        },

        renderMarkers: function() {
            var geojsonLayer = new L.GeoJSON(null, {
                pointToLayer: function (latlng){
                    return new L.CircleMarker(latlng, {
                        radius: 8,
                        fillColor: "#ff7800",
                        color: "#000",
                        weight: 1,
                        opacity: 1,
                        fillOpacity: 0.8
                    });
                }
            });

            geojsonLayer.addGeoJSON(this.markers); // this.markers is undefined
            this.$map.addLayer(geojsonLayer); // this.$map is undefined

        },

        getMarkers: function() {
            $.getJSON("/geojson/", function (data) {
                return data;
            });
        }
    };

    /**
     * A interactions
     */
    $(document).ready(function() {
        A.init()
    });

})(jQuery.noConflict());

私は一日の多くを検索に費やしていて、ここで基本的な何かが欠けていると思いますが、私はそれを理解していません。

4

2 に答える 2

3

もメソッドrenderMapもgetMarkers値を返さないため、戻り値はundefinedです。

これらのフィールドを ajax リクエストから初期化しようとしているようですが、これは必ずしも良い考えではありません。

おそらくあなたがすべきことは次のようなものです：

getMarkers: function(callback){
    var result = this;
    $.getJSON("url", function(jsonData){ 
        result.markers = jsonData; 
        if(callback) callback()
     });
},

オブジェクトのフィールドが利用可能になると、遅延して初期化されます。

NB : AJAX は非同期であるため、このコールバックがメンバーを迅速に設定することに依存することはできません (失敗する可能性があります)。これは、設計についてもう少し考え、コールバックをもっと使用する必要があることを示唆しています。

たとえば、上記の関数getMarkersとrenderMap関数を変更して、データが保存された後に呼び出されるコールバックを受け取り、init を次のように変更します。

init: function(){
    var res = this;
    var post_init_callback = function(){
        if(res.$map != undefined && res.markers!=undefined){
            //this will only run after both ajax calls are complete
            res.renderMarkers();  
        }
    };
    this.getMarkers(post_init_callback);
    this.renderMap(post_init_callback);
},
于 2012-05-10T01:34:02.353 に答える
1

ここでの問題は、別の関数内で return を呼び出すことです。getMarkers基本的に行っていることは、(最も単純な例) を次のように定義することです。

getMarkers: function() {
    $.getJSON('/geojson/', some_random_func);
}

その時点で、getMarkers が実際には何も返さないことが明らかになります (つまり未定義)。同じことが renderMap 関数にも当てはまります。また、この場合、「some_random_func」は次のように定義されてfunction(data) { return data; }いますが、それは何に返されますか? 真実は、some_random_funcjQuery自体によって呼び出され、AFAIK jQueryはその成功関数の戻り値をまったく気にしないということです。

于 2012-05-10T01:36:44.117 に答える