Векторная графика своими руками 2

   Расскажу о том, как заполняются цветом элементы векторной графики.
   Для меня это оказалось проблемой, так как Визуал Бейсик, в котором я работаю, такой вещи, как заливка, не предусматривает. Поэтому пришлось выкручиваться.
   Я заполняю фигуры и кривые Безье веером – линиями, расходящимися из точки. Для выпуклой кривой Безье эта точка находится в начале кривой, а для перекрученной кривой она в определённый момент переходит на конец кривой. Линии, исходящие из точки упираются вторым концом в кривую Безье, а поскольку траектория Безье задаётся параметрически, и параметр меняется плавно (от нуля до единицы), то сегмент кривой заполняется линиями равномерно. Если линии тонкие, то веер из них смотрится красиво, открывая фон, находящийся под ним. А при толстых линиях получается обычная сплошная заливка. Для одиночных кривых Безье это нормально, а вот для фигуры получается не очень – заливаются сегменты кривых, составляющих фигуру, а не вся фигура целиком.
    Это, однако, легко поправить – достаточно к кривым Безье, составляющим контур фигуры, добавить ещё одну кривую, заполняющую своей заливкой пустое место и к тому же окрашенную в другой цвет. Таким образом у красного яблочка появился розовый бочок.

    Посмотрим теперь, как нарисовано, из каких элементов состоит яблочко.
    Оно состоит из пяти элементов – трёх фигур и двух кривых Безье. Корпус яблока составлен из фигуры 38 и наложенной поверх фигуры 36 таких же очертаний. 38 и 36 это логотипы, обозначения двух фигур разного сорта, которые используются в программе. Фигуры 36 и 38 различаются методом зачерчивания – в фигуре 38 заполняются цветом отдельные сегменты кривых, а фигура 36 зачерчивается целиком, при этом линии зачерчивания исходят из точки, координаты которой указываются особо.

    Листочек у яблочка тоже составной. Он составлен из кривой Безье светло зелёного цвета, толстенькой и заострённой на концах, и фигуры 36 тёмно зелёного цвета, помещенной сверху.
    Каждую фигуру можно разбить на составляющие её кривые, и тогда мы увидим то, что показано на рисунке. После этого кривые можно переделывать, чертить заново и править, а затем вновь собирать в фигуру.

   Одним словом, векторное рисование это творческий и интересный процесс.
_________
8.07.2020

ПРИЛОЖЕНИЕ

Вот, как выглядит содержимое файла, хранящего рисунок яблока –

X      просмотр массива G     31-кр.Безье  36,38-Фигура                Nстрок= 16
 ____ 13-Прям-к  14-Круг  22-Прямая  25-Веер  26-Мног-к  27-Полилиния ___

        1>     38  551  225  2  4  6  0  0  28  15870  3     /тело яблока
   2      0  551  225  551  225  551  172  594  188  28  30  /три красных бочка
   3      0  594  188  650  215  662  261  626  283  28  30
   4      0  626  283  580  313  509  258  546  237  28  30
   5      0  545  236  688  402  620  88  551  225  15870  15870 /розовая серединка
        6>     36  551  225  7  3  0  552  223  7190  6943  1  /зототистая сетка по тем же координатам
   7      0  551  225  551  225  551  172  594  188  0  0
   8      0  594  188  650  215  662  261  626  283  0  0
   9      0  626  283  580  313  509  258  546  237  0  0
        10>     31  538  210  11  7  0  0  0  7190  6943  5      /черешок
   11      0  538  210  538  214  548  221  549  223  7190 -57
        12>     31  542  222  13  9  0  0  0  3817  6943  5      /листик
   13      0  542  222  525  230  521  227  493  226  3817  6943
        14>     36  539  225  15  2  1  534  224  3714  480  1    /тёмная сетка на листике
   15      0  539  225  516  210  494  228  494  228  0  0
   16      0  492  229  492  229  533  252  538  223  0  0

Заметьте, что в браузере яблоко оказалось жёлтым. Это потому, что браузер моих примочек с зачерчиванием тонкими линиями не понимает, и заливает контур фигуры 36 одном тоном.


Рецензии