Здравствуйте. Располагаю часть изображения на canvase. При этом хочется, чтобы оно не сразу вставлялось, а появлялось постепенно.
ctxBuildings.clearRect(build.x * tileWidth, build.y * tileHeight, 25, 25); // зачищаю место куда буду вставлять
ctxBuildings.globalAlpha = build.opacity; // изменяю на прозрачность 0.2 по умолчанию для каждого объекта build
ctxBuildings.drawImage(tiles, (build.type - 1) * tileWidth, tileWidth, tileWidth, tileWidth, build.x * tileWidth, build.y * tileHeight, 25, 25); // вставляю изображение
build.opacity += 0.1;
ctxBuildings.globalAlpha = 1; // меняю прозрачность на 1
И это все делаю в цикле, с каждой секундой изменяется прозрачность на 0.1 и есть эффект что изображение постепенно появляется.
Но стоит мне это сделать с двумя изображениями одновременно (вставил одно, затем другое в другое место), то появление первого изображения останавливается, а появление второго начинается уже не с 0.2, а с того момента где остановилось первое.
Есть ли способы анимации изображений на одном canvase, чтобы они шли независимо друг от друга. Или как можно реализовать разную прозрачность на одном canvase. Или же как можно наиболее просто сделать появление двух изображений?
Спасибо