Масштабируемая векторная графика
[+]
Опубликован: 07.11.2007 | Доступ: свободный | Студентов: 1769 / 347 | Оценка: 4.29 / 4.14 | Длительность: 25:09:00
Тема: Компьютерная графика
Специальности: Программист
Теги: arc, baseline, css, flash, glyph, html, marker, stroke, SVG, sweep, x-axis, анимация, браузеры, графика, паттерн, паттерны, поддержка, радиальный градиент, форматы, цвета, шрифты, элементы
Лекция 9:

Фильтры. Часть III
A
|
версия для печати
< Лекция 8 || Лекция 9: 12345 || Лекция 10 >

feTurbulence

Фильтр feTurbulence содержит встроенные средства для генерации структуры, напоминающей облака или мрамор. В сочетании с фильтрами освещения (см. "Фильтры. Часть IV" ) эти текстуры могут быть окрашены в произвольные цвета, а также менять свой вид (например, выглядеть как мешковина). Структура этого фильтра выглядит так (рис. 9.3 ):

Структура фильтра feTurbulence

увеличить изображение
Рис. 9.3. Структура фильтра feTurbulence

Атрибуты отвечают за внешний вид генерируемой структуры: зернистость, размер волокон, их количество и направление. В табл. 9.5 приводится описание атрибутов фильтра.

Таблица 9.5.
№ Название
9.5.1 baseFrequency
Описание
Частота генерации шума, которая представляется в виде двух чисел, определяющих горизонтальное и вертикальное направления. Если задается одно число, то оно по умолчанию принимается для обоих направлений.
Диапазон значений
<number> <number>
Значение по умолчанию
0
№ Название
9.5.2 numOctaves
Описание
Число гармоник генерации шума.
Диапазон значений
<integer>
Значение по умолчанию
1
№ Название
9.5.3 seed
Описание
Начальное число на основании которого генерируются случайные числа.
Диапазон значений
<number>
Значение по умолчанию
0
№ Название
9.5.4 stitchTiles
Описание
При значении stitch сглаживаются края генерируемых линий.
Диапазон значений
stitch | noStitch
Значение по умолчанию
noStitch
№ Название
9.5.5 type
Описание
Тип генерируемой текстуры.
Диапазон значений
fractalNoise | turbulence
Значение по умолчанию
turbulence

В табл. 9.6 приводятся примеры использования этого фильтра.

Таблица 9.6.
№ Код Вид в браузере
9.6.1 
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg width="200" height="200" 
     xmlns="http://www.w3.org/2000/svg" version="1.1">
     <title> Лекция 9. Фильтры. Часть III </title>
     <desc>
          Пример feTurbulence1.svg
     </desc>

<defs>

<filter id="myFilter" filterUnits="userSpaceOnUse" 
        x="0" y="0" width="200" height="200">
<feTurbulence type="fractalNoise" baseFrequency="0.01" 
              numOctaves="4" seed="0"/>
</filter>


</defs>
<rect x="0" y="0" width="200" height="200" 
      filter="url(#myFilter)"/>

</svg>
Листинг 9.6.1. Пример feTurbulence1.svg
Описание
Тип fractalNoise наиболее пригоден для создания структуры, напоминающей облака.
№ Код Описание
9.6.2 
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg width="460" height="610" 
     xmlns="http://www.w3.org/2000/svg" version="1.1">
     <title> Лекция 9. Фильтры. Часть III </title>
     <desc>
          Пример feTurbulence2.svg
     </desc>

<defs>

<filter id="myFilter1" filterUnits="userSpaceOnUse" 
        x="0" y="0" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.01" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter2" filterUnits="userSpaceOnUse" 
        x="150" y="0" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.02" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter3" filterUnits="userSpaceOnUse" 
        x="300" y="0" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.05" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter4" filterUnits="userSpaceOnUse" 
        x="0" y="150" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.1" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter5" filterUnits="userSpaceOnUse" 
        x="150" y="150" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.2" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter6" filterUnits="userSpaceOnUse" 
        x="300" y="150" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.3" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter7" filterUnits="userSpaceOnUse" 
        x="0" y="300" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.4" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter8" filterUnits="userSpaceOnUse" 
        x="150" y="300" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.5" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter9" filterUnits="userSpaceOnUse" 
        x="300" y="300" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.6" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter10" filterUnits="userSpaceOnUse" 
        x="0" y="450" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.7" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter11" filterUnits="userSpaceOnUse" 
        x="150" y="450" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter12" filterUnits="userSpaceOnUse" 
        x="300" y="450" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="1" 
              numOctaves="4" seed="0"/>
</filter>

</defs>
<rect x="0" y="0" width="150" height="150" 
      filter="url(#myFilter1)"/>
<rect x="150" y="0" width="150" height="150" 
      filter="url(#myFilter2)"/>
<rect x="300" y="0" width="150" height="150" 
      filter="url(#myFilter3)"/>
<rect x="0" y="150" width="150" height="150" 
      filter="url(#myFilter4)"/>
<rect x="150" y="150" width="150" height="150" 
      filter="url(#myFilter5)"/>
<rect x="300" y="150" width="150" height="150" 
      filter="url(#myFilter6)"/>
<rect x="0" y="300" width="150" height="150" 
      filter="url(#myFilter7)"/>
<rect x="150" y="300" width="150" height="150" 
      filter="url(#myFilter8)"/>
<rect x="300" y="300" width="150" height="150" 
      filter="url(#myFilter9)"/>
<rect x="0" y="450" width="150" height="150" 
      filter="url(#myFilter10)"/>
<rect x="150" y="450" width="150" height="150" 
      filter="url(#myFilter11)"/>
<rect x="300" y="450" width="150" height="150" 
      filter="url(#myFilter12)"/>

<!--Вспомогательные фигуры-->
<rect x="0" y="0" width="450" height="600" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="150" y="0" width="150" height="600" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="0" y="150" width="450" height="150" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="0" y="450" width="450" height="150" 
       style="fill:none;stroke:black; stroke-width:2"/>

<!--Подписи-->
<text x="10" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0.01"</text>
<text x="160" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0.02"</text>
<text x="310" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0.05"</text>

<text x="10" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.1"</text>
<text x="160" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.2"</text>
<text x="310" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.3"</text>

<text x="10" y="315" style="fill: black; font-size: 12px">
       baseFrequency="0.4"</text>
<text x="160" y="315" style="fill: black; font-size: 12px">
       baseFrequency="0.5"</text>
<text x="310" y="315" style="fill: black; font-size: 12px">
       baseFrequency="0.6"</text>

<text x="10" y="465" style="fill: black; font-size: 12px">
       baseFrequency="0.7"</text>
<text x="160" y="465" style="fill: black; font-size: 12px">
       baseFrequency="0"</text>
<text x="310" y="465" style="fill: black; font-size: 12px">
       baseFrequency="1"</text>

</svg>
Листинг 9.6.2. Пример feTurbulence2.svg
Атрибут baseFrequency за управление ячеистой структуры. Чем больше значение этого атрибута, тем меньше размер структуры.
Вид в браузере
№ Код Описание
9.6.3 
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg width="460" height="610" 
     xmlns="http://www.w3.org/2000/svg" version="1.1">
     <title> Лекция 9. Фильтры. Часть III </title>
     <desc>
          Пример feTurbulence3.svg
     </desc>

<defs>

<filter id="myFilter1" filterUnits="userSpaceOnUse" 
        x="0" y="0" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.01" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter2" filterUnits="userSpaceOnUse" 
        x="150" y="0" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.02" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter3" filterUnits="userSpaceOnUse" 
        x="300" y="0" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.05" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter4" filterUnits="userSpaceOnUse" 
        x="0" y="150" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.1" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter5" filterUnits="userSpaceOnUse" 
        x="150" y="150" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.2" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter6" filterUnits="userSpaceOnUse" 
        x="300" y="150" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.3" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter7" filterUnits="userSpaceOnUse" 
        x="0" y="300" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.4" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter8" filterUnits="userSpaceOnUse" 
        x="150" y="300" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.5" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter9" filterUnits="userSpaceOnUse" 
        x="300" y="300" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.6" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter10" filterUnits="userSpaceOnUse" 
        x="0" y="450" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.7" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter11" filterUnits="userSpaceOnUse" 
        x="150" y="450" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter12" filterUnits="userSpaceOnUse" 
        x="300" y="450" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="1" 
              numOctaves="4" seed="0"/>
</filter>

</defs>
<rect x="0" y="0" width="150" height="150" 
      filter="url(#myFilter1)"/>
<rect x="150" y="0" width="150" height="150" 
      filter="url(#myFilter2)"/>
<rect x="300" y="0" width="150" height="150" 
      filter="url(#myFilter3)"/>
<rect x="0" y="150" width="150" height="150" 
      filter="url(#myFilter4)"/>
<rect x="150" y="150" width="150" height="150" 
      filter="url(#myFilter5)"/>
<rect x="300" y="150" width="150" height="150" 
      filter="url(#myFilter6)"/>
<rect x="0" y="300" width="150" height="150" 
      filter="url(#myFilter7)"/>
<rect x="150" y="300" width="150" height="150" 
      filter="url(#myFilter8)"/>
<rect x="300" y="300" width="150" height="150" 
      filter="url(#myFilter9)"/>
<rect x="0" y="450" width="150" height="150" 
      filter="url(#myFilter10)"/>
<rect x="150" y="450" width="150" height="150" 
      filter="url(#myFilter11)"/>
<rect x="300" y="450" width="150" height="150" 
      filter="url(#myFilter12)"/>

<!--Вспомогательные фигуры-->
<rect x="0" y="0" width="450" height="600" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="150" y="0" width="150" height="600" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="0" y="150" width="450" height="150" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="0" y="450" width="450" height="150" 
       style="fill:none;stroke:black; stroke-width:2"/>

<!--Подписи-->
<text x="10" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0.01"</text>
<text x="160" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0.02"</text>
<text x="310" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0.05"</text>

<text x="10" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.1"</text>
<text x="160" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.2"</text>
<text x="310" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.3"</text>

<text x="10" y="315" style="fill: black; font-size: 12px">
       baseFrequency="0.4"</text>
<text x="160" y="315" style="fill: black; font-size: 12px">
       baseFrequency="0.5"</text>
<text x="310" y="315" style="fill: black; font-size: 12px">
       baseFrequency="0.6"</text>

<text x="10" y="465" style="fill: black; font-size: 12px">
       baseFrequency="0.7"</text>
<text x="160" y="465" style="fill: black; font-size: 12px">
       baseFrequency="0"</text>
<text x="310" y="465" style="fill: black; font-size: 12px">
       baseFrequency="1"</text>

</svg>
Листинг 9.6.3. Пример feTurbulence3.svg
Тип turbulence позволяет имитировать мраморную поверхность.
Вид в браузере
№ Код Описание
9.6.4 
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg width="460" height="310" 
     xmlns="http://www.w3.org/2000/svg" version="1.1">
     <title> Лекция 9. Фильтры. Часть III </title>
     <desc>
          Пример feTurbulence4.svg
     </desc>

<defs>

<filter id="myFilter1" filterUnits="userSpaceOnUse" 
        x="0" y="0" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0,0.1" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter2" filterUnits="userSpaceOnUse" 
        x="150" y="0" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0,0.1" 
              numOctaves="4" seed="10"/>
</filter>

<filter id="myFilter3" filterUnits="userSpaceOnUse" 
        x="300" y="0" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.01, 0.1" 
              numOctaves="4" seed="1"/>
</filter>

<filter id="myFilter4" filterUnits="userSpaceOnUse" 
        x="0" y="150" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.1,0.01" 
              numOctaves="4" seed="1"/>
</filter>

<filter id="myFilter5" filterUnits="userSpaceOnUse" 
        x="150" y="150" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.1, 0" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter6" filterUnits="userSpaceOnUse" 
        x="300" y="150" width="150" height="150">
<feTurbulence type="fractalNoise" baseFrequency="0.1,0" 
              numOctaves="4" seed="10"/>
</filter>

</defs>
<rect x="0" y="0" width="150" height="150" 
      filter="url(#myFilter1)"/>
<rect x="150" y="0" width="150" height="150" 
      filter="url(#myFilter2)"/>
<rect x="300" y="0" width="150" height="150" 
      filter="url(#myFilter3)"/>
<rect x="0" y="150" width="150" height="150" 
      filter="url(#myFilter4)"/>
<rect x="150" y="150" width="150" height="150" 
      filter="url(#myFilter5)"/>
<rect x="300" y="150" width="150" height="150" 
      filter="url(#myFilter6)"/>


<!--Вспомогательные фигуры-->
<rect x="0" y="0" width="450" height="300" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="150" y="0" width="150" height="300" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="0" y="150" width="450" height="150" 
       style="fill:none;stroke:black; stroke-width:2"/>

<!--Подписи-->
<text x="10" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0,0.1" </text>
<text x="10" y="30" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="10" y="45" style="fill: black; font-size: 12px">
       seed="0"</text>

<text x="160" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0,0.1"  </text>
<text x="160" y="30" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="160" y="45" style="fill: black; font-size: 12px">
       seed="10"</text>

<text x="304" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0.01, 0.1" </text>
<text x="304" y="30" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="304" y="45" style="fill: black; font-size: 12px">
       seed="1"</text>

<text x="5" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.1,0.01"</text>
<text x="5" y="180" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="5" y="195" style="fill: black; font-size: 12px">
       seed="1"</text>

<text x="160" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.1, 0"  </text>
<text x="160" y="180" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="160" y="195" style="fill: black; font-size: 12px">
       seed="0"</text>

<text x="310" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.1,0"  </text>
<text x="310" y="180" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="310" y="195" style="fill: black; font-size: 12px">
       seed="10"</text>

</svg>
Листинг 9.6.4. Пример feTurbulence4.svg
Атрибут seed отвечает за выраженность слоистой структуры. Пара значений атрибута baseFrequency задает направление структуры.
Вид в браузере
№ Код Описание
9.6.5 
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN"
 "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<svg width="460" height="310" 
     xmlns="http://www.w3.org/2000/svg" version="1.1">
     <title> Лекция 9. Фильтры. Часть III </title>
     <desc>
          Пример feTurbulence5.svg
     </desc>

<defs>

<filter id="myFilter1" filterUnits="userSpaceOnUse" 
        x="0" y="0" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0,0.1" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter2" filterUnits="userSpaceOnUse" 
        x="150" y="0" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0,0.1" 
              numOctaves="4" seed="10"/>
</filter>

<filter id="myFilter3" filterUnits="userSpaceOnUse" 
        x="300" y="0" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.01, 0.1" 
              numOctaves="4" seed="1"/>
</filter>

<filter id="myFilter4" filterUnits="userSpaceOnUse" 
        x="0" y="150" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.1,0.01" 
              numOctaves="4" seed="1"/>
</filter>

<filter id="myFilter5" filterUnits="userSpaceOnUse" 
        x="150" y="150" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.1, 0" 
              numOctaves="4" seed="0"/>
</filter>

<filter id="myFilter6" filterUnits="userSpaceOnUse" 
        x="300" y="150" width="150" height="150">
<feTurbulence type="turbulence" baseFrequency="0.1,0" 
              numOctaves="4" seed="10"/>
</filter>

</defs>
<rect x="0" y="0" width="150" height="150" 
      filter="url(#myFilter1)"/>
<rect x="150" y="0" width="150" height="150" 
      filter="url(#myFilter2)"/>
<rect x="300" y="0" width="150" height="150" 
      filter="url(#myFilter3)"/>
<rect x="0" y="150" width="150" height="150" 
      filter="url(#myFilter4)"/>
<rect x="150" y="150" width="150" height="150" 
      filter="url(#myFilter5)"/>
<rect x="300" y="150" width="150" height="150" 
      filter="url(#myFilter6)"/>


<!--Вспомогательные фигуры-->
<rect x="0" y="0" width="450" height="300" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="150" y="0" width="150" height="300" 
       style="fill:none;stroke:black; stroke-width:2"/>
<rect x="0" y="150" width="450" height="150" 
       style="fill:none;stroke:black; stroke-width:2"/>

<!--Подписи-->
<text x="10" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0,0.1" </text>
<text x="10" y="30" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="10" y="45" style="fill: black; font-size: 12px">
       seed="0"</text>

<text x="160" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0,0.1"  </text>
<text x="160" y="30" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="160" y="45" style="fill: black; font-size: 12px">
       seed="10"</text>

<text x="304" y="15" style="fill: black; font-size: 12px">
       baseFrequency="0.01, 0.1" </text>
<text x="304" y="30" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="304" y="45" style="fill: black; font-size: 12px">
       seed="1"</text>

<text x="5" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.1,0.01"</text>
<text x="5" y="180" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="5" y="195" style="fill: black; font-size: 12px">
       seed="1"</text>

<text x="160" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.1, 0"  </text>
<text x="160" y="180" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="160" y="195" style="fill: black; font-size: 12px">
       seed="0"</text>

<text x="310" y="165" style="fill: black; font-size: 12px">
       baseFrequency="0.1,0"  </text>
<text x="310" y="180" style="fill: black; font-size: 12px">
       numOctaves="4"</text>
<text x="310" y="195" style="fill: black; font-size: 12px">
       seed="10"</text>

</svg>
Листинг 9.6.5. Пример feTurbulence5.svg
Слоистая стуктура и ее направления для типа turbulence.
Вид в браузере
Дальше >>
< Лекция 8 || Лекция 9: 12345 || Лекция 10 >

Вопросы и ответы

вопросов: 0