2015-11-27 4 views
0

У меня есть объект EaselJS Shape, который содержит кэшированные графические инструкции, которые действительно дороги. Каждый кадр я рисую больше графики в кеш с помощью myShape.updateCache("source-overlay");, поэтому их не нужно будет перерисовывать следующий кадр.Копировать шейп формы в виде растрового изображения исходного изображения

Но я хочу, чтобы удалить старую кэшированную графику через 1 секунду, так что я думал о создании buffer растрового объекта, скопировать кэш из myShape в image собственности buffer «с, ясно myShape текущим кэшем и продолжить рисовать новые графики на него , затем через 1 секунду очистите буфер.

Трудно объяснить, я знаю, но упрощая вещи:

var myShape = new createjs.Shape(); 
var buffer = new createjs.Bitmap(); 

myShape.cache(0, 0, innerWidth, innerHeight); 
stage.addChild(myShape, buffer); 

function tick() { 
    myShape.graphics.s("#F00").lt(Math.random() * 100, Math.random() * 100); 
    myShape.updateCache("source-overlay"); 
    myShape.graphics.clear(); 
} 
setInterval(function(){ 
    buffer.alpha = 1; 
    buffer.image = myShape.getCacheDataURL(); 
    myShape.updateCache(); 
    createjs.Tween.get(buffer).to({alpha: 0}, 1000); 
},1000); 

Проблема заключается в том, что myShape «s кэш не будет выглядеть как buffer» исходного изображения s. Зачем?

+0

Метод getCacheDataURL возвращает строку. Вы должны передать это как src нового изображения, а затем установить это изображение в качестве источника. – Lanny

+0

Я заметил, что сразу после публикации вопроса, но этот метод слишком медленный. Разве нет лучшего способа сделать это? Возможно, копирование кеша формы в кеш другого объекта путем вызова 'clone' ... –

+0

Вы можете обернуть выводное растровое изображение в контейнере и кэш, чтобы поддерживать второй кеш. – Lanny

ответ

Смежные вопросы