0

json ファイルを読み込んで、Javascript の配列に解析しています。要素の 1 つはイメージへのパスです。まだ画像を読み込む準備ができていませんが、画像の高さを取得する必要があります。次のようなコードでそれを行う方法を知っています（他のstackoverflowページにあります）

function getimageheight(img) {
    var tmpImg = new Image();
    tmpImg.onload = function() {
        var ht = this.height;   
        return ht+0;
    }
    tmpImg.src = img;
}

この関数をループで呼び出そうとすると、画像のオンロードがループよりも遅く実行されているため、undefined が返されます。私の実際のコードはこれです：

        var j = 0;
        $.each(cat.placemarks, function(index, mark) {
            markers[cat.name][j] = [];
            markers[cat.name][j].name = mark.name;
            markers[cat.name][j].title = mark.title;
            markers[cat.name][j].markerURL = mark.markerURL;
            markers[cat.name][j].imageURL = mark.imageURL;
            markers[cat.name][j].imageHEIGHT = getimageheight(projpath+mark.imageURL);
            j++;
        });

関数を一度呼び出すと、機能します。しかし、ループで呼び出すことはできません。どうすればこれを修正できますか?

4

2 に答える 2

2

データ オブジェクトへの参照をロードに使用される Img オブジェクトに格納すると、ロードが完了した後でそのプロパティの値を設定できます。それが理にかなっていることを願っています...ロードが完了する前に、データを使用する準備ができていません。コードはこちら

var total=cat.placemarks.length;//if an array, otherwise use another each cycle to get object count
var loaded=0;

$each(cat.placemarks, function(index, mark) {
    markers[cat.name][j] = [];

    var tmpImg = new Image();
    tmpImg.refToObjWithNameOfYourChoice=markers[cat.name][j];
    tmpImg.onload = function() {
        this.refToObjWithNameOfYourChoice.imageHEIGHT=this.heigh;
        loaded++;
        if(loaded==total){
            //markers data is ready to use - add function callback herer or sumthin'
        }
    }
    tmpImg.src=projpath+mark.imageURL;

    markers[cat.name][j].name = mark.name;
    markers[cat.name][j].title = mark.title;
    markers[cat.name][j].markerURL = mark.markerURL;
    markers[cat.name][j].imageURL = mark.imageURL;
    j++;

});
于 2013-08-24T20:27:12.693 に答える