Сохранение и восстановление холста

В настоящее время я делаю приложение, которое позволяет пользователю создавать слайд-шоу. Я использую Fabricjs, чтобы они добавляли текст и прочее на текущий слайд. Но я хочу, чтобы они также могли добавлять новые слайды.

Поэтому мне нужен способ сохранить и сохранить текущий слайд (холст), когда они нажимают кнопку «новый слайд».
Другое дело, что пользователю разрешено редактировать предыдущий холст, выбирая их из столбцов.

Я относительно новичок в html5 и Fabricjs, поэтому я действительно понятия не имею, как это сделать. Я пытался использовать функцию клонирования, но ничего не вышло, как и drawImage из предыдущего холста.

Любые мысли, которые могут помочь мне начать работу над этим?

Я также думал о способе хранения созданного холста, и мне было интересно, хороший ли способ использовать массивы.

Спасибо за вашу помощь

Вкратце: я хочу сохранить холст, очистить его и восстановить позже.


canvas html fabricjs
person SnoWhite    schedule 01.03.2013    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Вы можете использовать сериализацию холста, чтобы сохранить холст в формате JSON и восстановить его позже, когда захотите. Для подробного руководства эта статья о FabricJs является хорошим началом.

person redGREENblue    schedule 01.03.2013

arrow_upward
0
arrow_downward 

ctx.fillStyle= 'red'
//  draw a rectangle with default settings
     ctx.fillRect(0,0,150,150);
     //  Save the default state
     ctx.save();   



 ctx.fillStyle = '#66FFFF'       
     ctx.fillRect( 15,15,120,120); 
     // Save the current state
    // ctx.save();


 // Restore previous state
     ctx.restore();
     ctx.fillRect(45,45,60,60);

пример из http://www.tutorialspoint.com/html5/canvas_states.htm

person zloctb    schedule 25.12.2014