2014-10-20 6 views
1

Я пытаюсь использовать полноэкранный режим (полноэкранный режим HTML5) для объекта canvas Fabric.js.Полноэкранный режим Canvas с использованием fabric.js

var canvas = fabricCanvas.getSelectionElement(); 
if(canvas.requestFullScreen) { 
    canvas.requestFullScreen(); 
} 
else if(canvas.webkitRequestFullScreen) { 
    canvas.webkitRequestFullScreen(); 
} 
else if(canvas.mozRequestFullScreen) { 
    canvas.mozRequestFullScreen(); 
} 

Проблема в том, что события не работают в полноэкранном режиме. Я предполагаю, что это вызвано использованием 2 холстов в Ткань: ниже для рисования и верхних для событий. Во время перехода в полноэкранный режим нижнее полотно становится «верхним». Кроме того, я пробовал:

var canvas = fabricCanvas.getSelectionElement(); 

В этом случае есть события, но визуализации нет. Есть идеи, как это решить?

ответ

1

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

var canvas = fabricCanvas.getSelectionElement().parentNode; 
if(canvas.requestFullScreen) { 
    canvas.requestFullScreen(); 
} 
else if(canvas.webkitRequestFullScreen) { 
    canvas.webkitRequestFullScreen(); 
} 
else if(canvas.mozRequestFullScreen) { 
    canvas.mozRequestFullScreen(); 
} 

Существует, вероятно, лучший способ в fabric.js достать контейнер чем .parentNode.

+0

спасибо. Ваше решение отлично работает. –

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