2010-07-05 8 views
5

Necesito un algoritmo para pintar nubes o formas similares a nubes. Obviamente, no quisiera que todos sean similares.
¿Qué debo usar para generar las series relevantes de coordenadas X, Y para pintar las nubes?
Voy a implementar esto ya sea en SVG o Canvas¿Cómo pinto las nubes?

+2

@Mitch Wheat - puede ser que no estoy usando las palabras correctas. Las primeras páginas en google donde están en la computación en la nube y en Amazon y resultados de búsqueda similares. –

+3

¿Qué pasa con este lugar? ¿Cómo ha estado esta pregunta durante una hora y nadie ha hecho una referencia de Bob Ross? –

+0

@Brahma Ghosh, fijo: http://stackoverflow.com/questions/3177121/how-do-i-paint-clouds/3177352#3177352 – Dolph

Respuesta

4

Puede usar la primitiva de filtro SVG feTurbulence para generar ruido Perlin, que se puede usar para crear texturas similares a nubes.

poco de ayuda y ejemplos:

El editor de gráficos Inkscape vector también tiene una gran colección de filtros SVG predefinidos, consulte here para una example usando solo algunos de ellos en algún texto. El "relleno de ruido" está usando feTurbulence, y probablemente sea bastante fácil de ajustar. Inkscape también tiene una GUI para ajustar los parámetros de cada filtro, seleccionar cualquier forma, luego seleccionar "Filtro> Editor de filtros ..." en los menús.

11

Depende exactamente de qué tipo de nubes vayas. Puedes probar Perlin noise, que es bastante popular entre los desarrolladores de juegos.

+0

Necesito implementarlo en SVG –

+0

¿Cómo le digo cuándo comenzar a cerrar la forma? ¿Tengo que hacerlo manualmente, o hay una ecuación para eso también? –

0

Si la implementación en lienzo y desea que la forma de la nube hinchada no es el tipo de ruido, diría dibujar un rectángulo de cierta longitud al azar a continuación, añadir los círculos de diferentes tamaños primero en los lados y luego a la parte superior para conseguir el efecto de la nube. Tendría que hacer algunos cálculos para asegurarse de que las nubes no se muestran debajo del rectángulo y que la parte superior del rectángulo no tiene secciones rectas. Pero no debería ser difícil de implementar en el lienzo.

+0

o simplemente fusionando muchos círculos, para que no tenga problemas con las secciones rectas –

+0

true. Estaba basando el mío en el que Mark señaló. – qw3n

3

Para darles a tus amigos árboles, pinta muchos pequeños accidentes felices.

recomiendo lienzo - usted puede conseguir loco con el cepillo!

me gustaría desearle feliz de la pintura, y Dios bendiga a mi amigo.

0

este código hace un montón de círculos en una variedad de colores tal vez le ayudará con las nubes

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(); 
     } 
    } 
0

Generar un racimo de burbujas (círculos o elipses horizontales) y tomar la unión de las formas de cada nube

Cuestiones relacionadas