Использование canvas текстур

когда беру аналогичную картинку из canvas

то она не учитывается в прелоадере, когда он пропадает

когда беру аналогичную картинку из canvas


Не очень понятно о чем именно идет речь

то она не учитывается в прелоадере, когда он пропадает


Вы имеете ввиду загрузку изображения, которое затем будет отрисовываться в canvas'e текстуры?
Тут уже придется производить изменения в загрузке движка. Мы подумаем над этим.
Если все же вам необходима смена текстуры, без использования canvas, то можно воспользоваться нодовой анимацией. Там не возникнет такой проблемы

Нет, не только загрузку изображения но и все действия отрисовки в канвасе. Там операции занимают тоже какое-то время. Картинку при желании можно и заранее произвести, у вас есть демо на гитхабе /apps_dev/code_snippets/code_snippets_dev.html?scene=canvas_texture тут загрузка текстур идет после инициализации сцены. Можно ли сделать так, чтобы загрузка текстур происходила во время инициализации сцены

Смотрите, я решил использовать canvas для отрисовки текстур, чтобы ускорить процесс загрузки сцены. Картинка png весит 6мб, 2 jpg картинки 600кб, если их определенным образом отрисовать в канвасе, получится таже png. Так можно уменьшить объем передаваемых данных. Дело в том что когда я беру эту картинку из канваса, движок вместо отрисовки прозрачности заливает её черным цветом

Нет, не только загрузку изображения но и все действия отрисовки в канвасе. Там операции занимают тоже какое-то время. Картинку при желании можно и заранее произвести, у вас есть демо на гитхабе /apps_dev/code_snippets/code_snippets_dev.html?scene=canvas_texture тут загрузка текстур идет после инициализации сцены. Можно ли сделать так, чтобы загрузка текстур происходила во время инициализации сцены


Тут я вас правильно понял. Скорее всего, вам надо будет написать свой прелоудер, завершающийся по окончанию отрисовок в canvas. Для многих демо-преложений мы делаем свои собственные прелоудеры (webplayer, как пример), это не так трудно. Если будут возникать вопросы, их можно задать тут.

function(){
    canvas = $.createElement({nodeName:'canvas', width:'4096', height:'4096'});
    var ctx_landscape = canvas.getContext('2d');

    if (ctx_landscape) 
    {		     
	    var image = new Image();
		image.src = 'texture.jpg';
		image.onload = function()
		{	
			var pattern = ctx_landscape.createPattern(image,'repeat');
			ctx_landscape.fillStyle = pattern;
			ctx_landscape.fillRect(0,0,ctx_landscape.canvas.width, ctx_landscape.canvas.height);
			
			ImageFromJpg.getData({type:'pattern', url:'texture2.jpg'},'l2.jpg', function(data)
			{	
				ctx_landscape.drawImage(data, 0, 0);

				ImageFromJpg.getData({type:'mask', color:'rgba(0, 0, 0, 0.1)'},'l1.jpg', function(data)
				{	ctx_landscape.drawImage(data, 0, 0);	
				})
			})
		}
	}
}