Всем привет.
Объясняю суть проблемы:
В канвас отображается несколько картинок, некоторые из них могут быть удалены, т.е нужно перерисовывать содержимое канвы.
Делаю это так:
// body это картинка - фон
var body = new Image(), canvas = this.html.canvas, w = canvas.width, h = canvas.height, self = this;
var scr = canvas.getContext('2d');
body.onload = function() {
//удаляю все с канвы и рисую по новой фон
scr.clearRect(0, 0, canvas.width, canvas.height);
scr.drawImage(body, 0, 0, canvas.width, canvas.height);
// self.addedAttr - обьект в котором находятся другие обьекты с данными о картинке. Где ее рисовать, ее размер, название и тд. Когда удаляю картинку с канвы удаляю ее из addedAttr и перерисовываю канвас
for(var key in self.addedAttr) {
var img = new Image();
var w = self.addedAttr[key].width; // ширина картинки
var h = self.addedAttr[key].height; // высота
var y = self.addedAttr[key].top, x = self.addedAttr[key].left; // х и у координаты
img.onload = function() {
scr.drawImage(img, x, y, w, h);
}
img.src = "/images/redactor/attrs/" + self.addedAttr[key].img;
}
};
body.src = "/images/redactor/bodys/" + this.data.image;
В результате у меня рисуется только 1 картинка на фоне, вместо нескольких.
В чем может быть проблема? Спасибо.