2013-11-20 4 views
2

Как реализовать элементы передней и задней стороны холста? (Я имею в виду при создании приложения для визитной карточки/футболки). Если я использую сериализацию/десериализацию, чтобы изменить активные элементы холста, как определить, какие объекты холста будут добавлены?Fabric.js: вид спереди и сзади

+1

это может быть полезно: http://jsfiddle.net/fpHaE/ или https://github.com/kangax/fabric.js/ вопросы/520 – DS9

ответ

1

Solved .. Я положил элементы холста в divs. (например: # container1, # container2);

Спрятать #container2;

Затем в JS сделал две переменные, как, что:

var canvas1 = new fabric.Canvas('c'); 
var canvas2 = new fabric.Canvas('c2'); 

Затем назначается canvascanvas1 или canvas2 переменных. Таким образом, мы можем активный холст мы хотим ..

Вот целая часть:

var canvas1 = new fabric.Canvas('c'); 
    var canvas2 = new fabric.Canvas('c2'); 

    var switcher = 1; 

    if(switcher == 1) { 
     var canvas = canvas1; 
     $("#container2").hide(); 
      fireEvents(); 
    } 

    $("#bside").click(function(){ 
     switcher = 2; 
     $("#container1").hide() 
     $("#container2").show(); 
      fireEvents(); 
     canvas = canvas2; 
     canvas.deactivateAllWithDispatch(); 
     canvas.calcOffset(); 
    }); 
    $("#fside").click(function(){ 
     switcher = 1; 
     $("#container1").show() 
     $("#container2").hide(); 
      fireEvents(); 
     canvas = canvas1; 
     canvas.deactivateAllWithDispatch(); 
     canvas.calcOffset(); 
    }); 

function fireEvents(){ 
canvas.on('object:selected', function(options){ 
// Event actions 
}); 
} 

используется canvas.deactivateAllWithDispatch(); отключить выбранные объекты из previus активного холста и fireEvents() функции применить обжигали события на обоих полотнах .. (не чувствуйте, что это правильный способ сделать это, хотя ...)

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