Элементы холста выглядят перекошенными в Webkit с помощью контекстного блендера - PullRequest
0 голосов
/ 20 июля 2011

РЕДАКТИРОВАТЬ: Ниже оригинальный пост, но я выяснил проблему. Похоже, проблема заключалась в использовании десятичного числа в качестве координаты Y (destY). Я разобрал это по округлению:

    var rand = {
      destX: Math.round(Math.random()*main.canvas.width),
      destY: Math.random()*main.canvas.height
    }

Я включил изображения, чтобы показать разницу между Firefox и Chrome. Как вы можете видеть, изображения, которые я наложил на холст, перекошены. Кто-нибудь испытывал это раньше? Это проблема с контекстным блендером или Webkits canvas вообще?

var main;

$(document).ready(function(){
  var canvas = document.getElementById('canvas');
  main = canvas.getContext('2d');
  main.canvas.width  = $(window).width();
  main.canvas.height = $(window).height()/2;
});

$(window).load(function(){
  var array = new Array();
  $('img').each(function(){
    var temp = document.createElement('canvas');
    var ctx = temp.getContext('2d');
    ctx.canvas.width = this.width;
    ctx.canvas.height = this.height;
    ctx.drawImage(this,0,0);
    var rand = {
      destX: Math.random()*main.canvas.width,
      destY: Math.random()*main.canvas.height
    }
    ctx.blendOnto(main,'multiply',rand);
  });
});

Firefox 4

Chrome 12

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...