私はグーグルマップに数百の建物のフットプリントをプロットしようとしています。しかし、私はコールバックに問題があります(私は思う)...
これを行うには、Googleマップが読み込まれた後、データベースから建物IDのリストを取得し、IDごとに新しいBuildingオブジェクトを作成します。
メインページ
function load_buildings() {
var url='/api/get_imaged_buildings/';
$.getJSON(url, function(buildings) {
for(var building in buildings) {
var new_building = new Building(buildings[building].id, buildings[building].footprint);
}
})
.error(function(jqXhr, textStatus, error) {
alert("ERROR: " + textStatus + ", " + error);
});
}
それは戻ります:
{"507ca17f0f53664a62000fc0": {"footprint": [[-71.06344334281945, 42.354043084935846], [-71.0637134471212, 42.35412603649889], [-71.06333405397038, 42.35480611690739], [-71.06338439864643, 42.35482782501911], [-71.0632517948924, 42.355064458152995], [-71.063047338961, 42.35496617995809], [-71.06308636758757, 42.35492158377903], [-71.06293828848663, 42.35485043826673], [-71.06289913717758, 42.354895213988364], [-71.06272577376158, 42.35481190819347], [-71.06319845721484, 42.35438624633442], [-71.06344334281945, 42.354043084935846]], "id": "507ca17f0f53664a62000fc0"},
Building.js
function Building(id, footprint) {
this.id = id;
this.footprint = footprint;
}
Building.prototype.plotFootprint = function() {
var footprint = [];
var footprint_from_db = this.footprint;
for(var i=0; i<footprint_from_db.length; i++)
{
var location = footprint_from_db[i];
var point = new google.maps.LatLng(location[0], location[1]);
bounds.extend(point);
footprint.push(point);
}
var building = new google.maps.Polyline({
path: footprint,
strokeColor: '#e81971',
strokeOpacity: 1.0,
strokeWeight: 2
});
building.setMap(map);
}
私がやりたいのは、すべての建物がロードされた後にすべての建物をプロットすることです。これを行うための最良の方法は何ですか?速度を最適化したいと思います。
ありがとう。
編集:私は悪いコードを取り出して、うまくいくものを選びました。今、私はすべてのフットプリントがすべてのオブジェクトにいつロードされるかを決定する方法と、それらをどこにプロットする必要があるのか疑問に思っています。