2013-05-20 1 views
1

Эй, я пытаюсь смешать два изображения с pixastic. Одно изображение можно перетащить на другое изображение (с jqueryUI), и после того, как оно получило правильное положение, оба изображения станут одним.Смешать два изображения с pixastic не работает. Как получить новый образ?

Так что я хочу использовать эффект pixastic blend.

Я попытался это до сих пор:

function BlendTheImages() { 
    var img = new Image(); 
    img.onload = function() { 
var blendImg = new Image(); 
blendImg.onload = function() { 
    Pixastic.process(img, "blend", 
     { 
      amount : 1, 
      mode : "multiply", 
      image : blendImg 
     } 
    ); 
} 
blendImg.src = "Small_Image.png"; 
    } 
img.src = "Background_Big_Image.jpg"; 
    }  

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

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

Пожалуйста, помогите мне! Спасибо

ответ

1

Я подумал об использовании html2canvas, чтобы захватить изображение, но затем я очень удивился, когда обнаружил, что, хотя он не задокументирован на веб-сайте Pixastic, эффект Blend также имеет функцию обратного вызова (которая работает так же, как и другие эффекты):

var img = new Image(); 
img.onload = function() { 
    Pixastic.process(img, "blend", 
     { 
      amount : 1.0, 
      mode : "Multiply", 
      image : someOtherImage 
     }, function(blendedImg) { 
      console.log(blendedImg); 
      applySepia(blendedImg); 
     } 
    ); 
} 
document.body.appendChild(img); 
img.src = "myimage.jpg"; 

Там в функцию обратного вызова для функции Pixastic.process и это работает для всех эффектов.