Как я крашу облака?
Мне нужен алгоритм для рисования облаков или облака как формы. Очевидно, я не хотел бы, чтобы они все были подобны.
Что я должен использовать для генерации соответствующей серии X, Y координаты для рисования облаков?
Я собираюсь реализовать это или в SVG или в Холсте
7 ответов
Вы можете использовать примитив SVG feTurbulence filter для генерации шума Перлина, который можно использовать для создания облачных текстур.
Некоторая помощь и примеры:
- http://www.w3.org/Graphics/SVG/IG/resources/svgprimer.html#feTurbulence
- http://commons.oreilly.com/wiki/index .php / SVG_Essentials / Filters
- http://pilatinfo.org/english/filters/index.htm
Редактор векторной графики Inkscape также имеет большую коллекцию предопределенных svg-фильтров, см. здесь для примера , используя лишь несколько из них в тексте. В «шумоподавлении» используется feTurbulence, и, вероятно, его довольно легко настроить. Inkscape также имеет графический интерфейс для настройки параметров каждого фильтра, выберите любую форму, затем выберите «Фильтр> Редактор фильтров ...» в меню.
Сгенерируйте скопление пузырьков (кругов или горизонтальных эллипсов) и возьмите объединение фигур для каждого облака.
вот пример шума Перлина, созданного с помощью silverlight: http://kodierer.blogspot.com/2009/05/oscar-algorithm-silverlight-real-time.html
это, вероятно, то, что вы можете использовать и / или адаптировать.
Это зависит от того, какие облака вы собираетесь использовать. Вы можете попробовать Perlin noise , который довольно популярен среди разработчиков игр.
Чтобы подарить деревьям друзей, нарисуйте много счастливых маленьких несчастных случаев.
Рекомендую холст - кистью можно сойти с ума!
Хочу пожелать вам счастливой живописи, и благословит Бог моего друга.
Если при реализации на холсте вы хотите, чтобы форма пухлого облака не напоминала шум, я бы сказал, нарисуйте прямоугольник произвольной длины, затем добавьте круги разных размеров сначала по бокам, а затем вверху. чтобы получить эффект облака. Вам нужно будет выполнить некоторые вычисления, чтобы убедиться, что облака не видны ниже прямоугольника и что верхняя часть прямоугольника не имеет прямых участков. Но это не должно быть сложно реализовать на холсте.
этот код делает кучу кругов в массиве цветов, возможно, он поможет вам с облаками
for (var i = 0; i < 12; i++)
{
for (var j = 0; j < 12; j++)
{
var ctx = document.getElementById('c1').getContext('2d');
ctx.strokeStyle = 'rgb(0,' + Math.floor(255 - 42.5 * i) + ',' +
Math.floor(255 - 42.5 * j) + ')';
ctx.beginPath();
ctx.arc(40 + j * 25, 40 + i * 25, 10, 0, Math.PI * 2, true);
ctx.stroke();
}
}