0

私たちのサイトのどこにでもGoogleマップを添付するために一行にする必要があるスクリプトを作成します。

時々10個のマップが同時にあるので、マップを作成できるオブジェクトを作成する関数が必要でした。問題は、maps.jsを必要としない場合でもロードしている場合です（ケースカウントマップ= 0）。

だから私はこれを作り始めました：

document.addEventListener("DOMContentLoaded", function(){ var map = new initmap(0, 'country_tinymap_canvas', {'longitude': {LONG}, 'latitude': {LAT}} ) }, false);

domreadyこれは私のマップをロードするためにバインドされます。{LONG}と{LAT}は賢く似たPHP変数であり、これらが数値であると想像してください。

また、GoogleMapsAPIコールバック用の小さなコールバックハンドラーを作成しました。

window.___gmapsready = function(){
    console.log("o/ - map here!");
    $(window).trigger('gmapsready');
}

新しいマップを作成すると、initmapオブジェクトが作成されます

function initmap(type,container,params) {
    var self = this;
    this.container = container;
    this.type = type;
    this.params = params;

    this.makemap = function()
    {
        console.log("doin map.");
        var mapc = document.getElementById(this.container);
        if (mapc != null)
        {
            var map = new google.maps.Map(mapc, window.___gmaps);
            var marker;

            var marker = new google.maps.Marker({
                position: new google.maps.LatLng(this.params.longitude,this.params.latitude),
                image: image,
                draggable: false,
                map: map
            });
            map.setCenter(new google.maps.LatLng(this.params.longitude,this.params.latitude));
        }
        console.log("map done, unset vars etc.");
    }

    this.checkload = function()
    {
        console.log("houston houston got map?");
        if (typeof google === 'object' && typeof google.maps === 'object')
        {
            console.log("thanks bro.");
            self.makemap();
        }
        else
        {
            console.log("nop. but i'm gonna load it.");
            var s = document.createElement("script");
            s.type = "text/javascript";
            s.src  = "http://maps.google.com/maps/api/js?v=3&sensor=true&callback=___gmapsready";
            $("head").append(s); 
            document.addEventListener("gmapsready", self.makemap);
        }
    }
    this.checkload();
}

問題は、イベントmakemapによって呼び出される関数を追加できないことです。gmapsreadyこれを行う方法を教えていただけませんか。

すべてが大丈夫ですが、document.addEventListener("gmapsready", self.makemap);呼び出し。

Ayeもdocument.addEventListener("gmapsready", function(event){self.makemap(event)}, false);同じ結果を出しました。

4

1 に答える 1

1

カスタムjQueryイベントをネイティブブラウザと混在させることはできませんaddEventListener。代わりにこれを試してください：

$(window).on('gmapsready',function() { self.makemap();});

于 2012-11-11T01:44:48.257 に答える