0

我正在尝试遍历某个列表并始终重绘我的画布。重绘画布后,我试图接收画布的 dataurl 并将其推送到数组中。那部分有效,但它总是给我与第一个相同的 dataurl。

当我查看画布中的绘图时,我总是得到正确的结果,但我无法获得该绘图的 dataurl。

var planNo = 0;
var map_json = {};

function getCanvasImages() {
    var coordinates = {};

    var plans = $.getJSON(site_url + 'DesktopModules/DNN.WebAPI/API/Ajax/GetPlanProjectsByProjectNo?projectNo=P0104');
    var lots= $.get(site_url + 'DesktopModules/DNN.WebAPI/API/Ajax/GetTranslatedByProjectNo?projectNo=P0104');

    $.when(plans, lots).done(function (p, l) {
        if (p != null && p != undefined) {
            var imagePositionY = 10;
            var table = $('table.livingTable');         

            $.each(p[0], function (key, value) {
                var canvas = map_shape[0]; // or document.getElementById('canvas');
                canvas.width = canvas.width;

                planNo = p[0][key].PlanNo;
                map_json = p[0][key].Coordinates;

                if (map_json != null) {
                    if (map_json.image != undefined) {
                        if (map_json.image.shift_x == undefined) map_json.image.shift_x = 0;
                        if (map_json.image.shift_y == undefined) map_json.image.shift_y = 0;
                        if (map_json.image.scale == undefined) map_json.image.scale = 1;

                        if (map_json.image.filename != undefined) {
                            loadImage();
                        }
                    }

                    if (map_json.shapes == undefined) {
                        map_json.shapes = [];
                    }
                }
            });                
        }
    });
};

var dataUrls = [];

function loadImage() {
    //console.log(map_json);
    map_bg_img.onload = function () {
        updateBackground();
        updateIcons();
        canvas.fadeIn("fast");
    }
    map_bg_img.src = (map_json.image.filename.indexOf("http") > -1 ? map_json.image.filename : map_json.image.filename);
    dataUrls.push(canvas[0].toDataURL("image/jpeg"));
}

有人可以帮助我吗?

4

1 回答 1

0

将 .push() 放入您的 onload 中:

dataUrls.push(canvas[0].toDataURL("image/jpeg"));

请记住,这map_bg_img.src是异步的,因此它将开始工作并立即释放到代码中的下一行——因此您的循环速度比您预期的要快。

于 2013-07-02T16:16:11.113 回答