Странный Холст HTML5 drawImage поведение

Я пишу некоторый код, который использует холст HTML5. Обычно это работает хорошо, но теперь я нашел очень странное поведение. Странная вещь состоит в том, что это последовательно на различных браузерах, так должен быть то, что я понял вещь неправильно... Несмотря на документы, кажется, говорят точно, что я делаю. Вот код (это - метод объекта):

   MyCanvas.prototype.getElement = function() {

        var innerHtml = "<div></div>";

        var elem = jQuery(innerHtml, {
            'id' : this.viewId
        });



        var canvas = jQuery("<canvas/>", {
            'id' : this.viewId + "canvas",
            'width' : this.width,
            'height' : this.height
        });

        var w = this.width;
        var h = this.height;

        jQuery(elem).append(canvas);

        var imgElem = new Image();

        imgElem.src = this.maskImage;
        imgElem.onload = function() {
            var ctx = canvas[0].getContext('2d');
            ctx.drawImage(this, 0, 0, w, h);

        };

        return elem;
    };

После этого я буду использовать jQuery снова для добавления этого элемента Отделению, которое уже находится на странице (который является пробелом). Результат будет состоять в том, что изображение перегружено как десять раз, это - ширина.... Это странно, потому что, поскольку, что я понял drawImage, это должно использовать w и значения h для масштабирования изображения и, учитывая, что w и h являются размером холста, он должен соответствовать хорошо.

Что я делаю неправильно? Это, потому что я делаю отступление представленного дерева DOM?

27
задан Kara 7 December 2013 в 20:30
поделиться