Форум Flasher.ru - Градиент от А до Я или полноцветный градиент

Форум Flasher.ru (http://www.flasher.ru/forum/index.php)

- ActionScript (http://www.flasher.ru/forum/forumdisplay.php?f=5)

- - Градиент от А до Я или полноцветный градиент (http://www.flasher.ru/forum/showthread.php?t=48302)

Градиент от А до Я или полноцветный градиент

Люди, поюзав немного программный градиент захотелось сделать (пииип!) радугу, но я даже не понял как сделать градиент более двух цветов... Подскажите кто знает, как это сделать?

Спасибо :)

_root.createEmptyMovieClip( "grad", 1 );
with ( _root.grad )
{
colors = [ 0xFF0000, 0x0000FF,0x00FF00 ];
alphas = [ 100, 100,100 ];
ratios = [ 0,0x11, 0xFF ];
matrix = { a:200, b:0, c:0, d:0, e:200, f:0, g:200, h:200, i:1 };
beginGradientFill( "linear", colors, alphas, ratios, matrix );
moveto(100,100);
lineto(100,300);
lineto(300,300);
lineto(300,100);
lineto(100,100);
endFill();
}
stop();
// чуть подправленный пример из хелпа
// трехцветный градиент

здесь нужна система не RGB а HSV (HSL)...
по ней все легко и просто получается :)

кто найдет полное объяснения какого-нибудь способа перевода rgb <--> hsl, будет тому щастье :) я не нашел...

вот. код не мой, где взял - не помню :)
почему из ржб в хсв тут переводится именно так - я не понимаю...

Код:

// FULL GRADIENT FILL EXAMPLE

//

_root.createEmptyMovieClip("FColorWheel", 1);

FColorWheel.hex = function(nmbr, base) {

        var hexStr = "ABCDEF";

        var hexVal = Math.round(nmbr*255/base);

        dig1 = hexVal%16;

        dig2 = (hexVal-dig1)/16;

        if (dig1>9) {

                dig1 = hexStr.charAt(dig1-10);

        }

        if (dig2>9) {

                dig2 = hexStr.charAt(dig2-10);

        }

        hexVal = dig2.toString()+dig1.toString();

        return hexVal;

};

//

FColorWheel.hsvToRGB = function(h, s, v) {

        var r, g, b, i, f, p, q, t;

        if (s == 0) {

                r = g=b=v;

        }

        if (h == 360) {

                h = 0;

        }

        h /= 60;

        i = Math.floor(h);

        f = h-i;

        p = v*(1-s);

        q = v*(1-(s*f));

        t = v*(1-(s*(1-f)));

        if (i == 0) {

                r = v;

                g = t;

                b = p;

        } else if (i == 1) {

                r = q;

                g = v;

                b = p;

        } else if (i == 2) {

                //

                r = p;

                g = v;

                b = t;

        } else if (i == 3) {

                r = p;

                g = q;

                b = v;

        } else if (i == 4) {

                r = t;

                g = p;

                b = v;

        } else if (i == 5) {

                r = v;

                g = p;

                b = q;

        }

        this.red = this.hex(r*255, 255);

        this.green = this.hex(g*255, 255);

        this.blue = this.hex(b*255, 255);

        this.hexColor = "0x"+this.red+this.green+this.blue;

        return this.hexColor;

};

//

FColorWheel.drawWheel = function(radius, centerX, centerY, s, b) {

        for (var i = 0; i<=360; i++) {

                angle0 = (i/180)*Math.PI;

                angle1 = ((i+1)/180)*Math.PI;

                c = this.hsvToRGB(360-i, s, b);

                with (this) {

                        colors = [0xFFFFFF, Number(c)];

                        alphas = [100, 100];

                        ratios = [0, 0xFF];

                        //

                        matrix = {a:2*radius, b:0, c:0, d:0, e:2*radius, f:0, g:centerX, h:centerY, i:1};

                        beginGradientFill("radial", colors, alphas, ratios, matrix);

                        moveTo(centerX, centerY);

                        lineTo(centerX+radius*Math.cos(angle0), centerY+radius*Math.sin(angle0));

                        lineStyle(1.25, "0x000000", 50);

                        //

                        lineTo(centerX+radius*Math.cos(angle1), centerY+radius*Math.sin(angle1));

                        lineStyle(0, "0x000000", 0);

                        moveTo(centerX, centerY);

                        endFill();

                }

        }

};

//

FColorWheel.drawWheel(100, 200, 200, 1, 1);

http://www.peterjoel.com/ActionScript/hsb_as.php

Очень и очень разумный дяденька :)

код что я запостил выше - точно тот же что и у этого дядьки (может я у него и взял ?..)
я его видел и читал...

НО

я не понимаю этой математики :)
почему так ?
он там ничего не объясняет в коде, просто пишет, цитирую:
"The colour-space conversion is based purely on my own interpretation and intuitive notion of the colour spaces."

ага, я за него очень рад, он умный, но объяснения нету :)

речь ведь не о том, чтобы найти готовую программу и использовать, а о том, чтобы хотя бы для начала понять что она делает и зачем :)

А я то почем знаю, мы боты даем ответы приблизительно по теме :)

Цитата:

Оригинал написал(а) llllllllll
А я то почем знаю, мы боты даем ответы приблизительно по теме :)

я буду ботом-задающим-вопросы :)

А впринципе вдумался :)

HSB - hue, saturation, brightness

Вся модель прдеставляется в виде цилиндра.

H - можно представить в виде окружности (весь спектр) где в 0-ле градусов красный цвет, в 120-ти - зеленый, в 240-ка - синий, наши знакомые RGB :)

В 60-ти градусах между чистым красным и чистым зеленым значение обоих будет 255 по RGB, тоесть получиться желтый, а вот в 30 градусах будет 255 красного и 127 зеленого - тоесть оранжевый :)

S - это как говорят "добавление белой краски", насыщенность, тоесть если у нас HSB [60,100,100] - то это значит, у нас по 255 RGB-ишных красного и зеленого, к синему, который имеет значение 0, ничего не прибавляется, но если сделать HSB[60,50,100] - где S равна 50%, то синяя компонента станет у нас 127, если синия компонента у нас была бы скажем 127 при 100% насышенности, то при 50% она стала бы (255 - 127)/2 + 127 `= 191

B Ну тут все понятно - Яркость или "добавление черной краски" - тут урезаем значение каждого цвета, тоесть если при 100% яркости максимальное значение красного было 255, то при 50% будет 127, и это соответсвенно берется в расчет насыщенности, тоесть HSB[60,100,50] = RGB[128,128,0], а HSB[60,50,50] будет RGB[128,128,64]

2Nox Noctis: хреновый из меня бот вышел :)

мда... а из меня бот, видимо, замечательный...

вот я по отдельности все твои слова понимаю - а что вместе получается...

из ржб в хсв (или обратно) нет функции (т.е. взаимнообратного соответствия)... то есть все варианты рассчета приблизительны...

в принципе это же должно быть похоже на перевод из ортогональных координат в циллиндрические, да ?

но что там за шаманство с переменными тогда...

Всем огромное спасибо!