Javascript. Манипуляции с изображением. Изменение пикселей.

Павел Александров

Здравствуйте!

Пишу скрипт, который должен прорисовывать некоторые картинки в канвасе в зависимости от действий пользователя. Возможно ли получить пиксели изображения и их изменить, например, повысить уровень синего цвета? В интернете нашёл лишь вариант, где изображение прорисовывают в канвас, получают область из канваса, её редактируют, и обратно прорисовывают. Возможно ли избежать этих прорисовок туда сюда?

Также интересует вопрос насчёт обрезки изображения (или канваса) во время прорисовки, но не вертикально или горизонтально, а хотя бы по диоганали, а лучше произвольной формы.

И последний вопрос, загрузка изображения из строки. В интернете видел множество вариантов с Base64, но повторить их не удалось в том виде, как мне надо. Там они подгружают в CSS или в тег image, а мне нужно внутри JS интерпретировать изображение из Base64 в нормальное.
Для работы с изображением использую следующий код:
```
function Img(src)
{
var img = new Image();
img.height = 0;
img.width = 0;
img.dx = 0;
img.dy = 0;
img.s = 1;

img.onload = function ()
{
    this.update();
}

img.scale = function(s)
{
    this.s = s;
    this.update();
}

img.draw = function (ctx)
{
    if (!this.complete) return;
    ctx.drawImage(this, -this.dx, -this.dy, this.width, this.height);
}

img.update = function()
{
    this.height = this.naturalHeight * this.s;
    this.width = this.naturalWidth * this.s;
    this.dy = this.height >> 1;
    this.dx = this.width >> 1;
}

img.src = src;
return img;

}

var b64Img = "SGVyZSBpcyBhIGJhc2U2NCBpbWFnZS4=";
var img = new ImgWrapper(new Img(b64Img));
/* imgWrapper позволяет позиционировать изображение на плоскости */
img.setPosition(750, 400);

var canvas = MyNameSpace.Canvas(parent_node); //the canvas size is equal to the size of a parent node
/*Расширение для обычного канваса, но с удобным механизмом управления объектами */
canvas.push(img);
```

Но и изображения никакого не получаю (что в данном варианте вполне логично), но я пробовал также различные приставки перед b64Img указывать, но нужного результат так и не добился.

Если у кого-то есть опыт в подобных вопросах, поделитесь как Вы решали эти задачи?

2 чел.