Need help with snow effect

• 10-29-2012, 02:59 PM
Vraith11
Need help with snow effect
Hello. As the title says i want to do a snow effect. The problem is that i can only get 1 snowflake in my picture. I really want to know how to copy the snow img so that i get many snowflakes falling from the top of the screen. Somewhere in here i have to add a code that duplicates the img "imgSnow".

if (canvas.getContext) {
ctx = canvas.getContext('2d');

function draw() {
drawBackground();
ctx.drawImage (imgSnow, x, y);

//------- Code i need ----------//

y += 9;

if (y > 450 ) {
y = -21;
x = Math.random () * 650;

}}}
• 10-29-2012, 03:30 PM
ReFreezed
You can draw the same picture several times to the canvas at the same time. You'll just have to switch your x and y variables with arrays. Something like this:

Code:

```var x = []; var y = []; for (var i = 0; i < 20; i++) {     y[i] = -21;     x[i] = Math.random () * 650; } function draw() {     drawBackground();     for (i = 0; i < x.length; i++)     {         ctx.drawImage (imgSnow, x[i], y[i]);         y[i] += 9;         if (y[i] > 450 ) {             y[i] = -21;             x[i] = Math.random () * 650;         }     } }```
• 10-29-2012, 04:02 PM
Vraith11
Not bad, thank you very much.

This JC world seems so distance to me :P. Only one problem remains. All the snowflakes are falling at the same time:P, looks more lika a wave then a snowstorm. Any variable to make the snowflakes fall at random time ? :)
• 10-29-2012, 04:18 PM
bundat
A quick hack would be to use random negative values for your initial y values, so that they have different starting points.

Something like... replacing the first
Code:

`y[i] = -21;`
with
Code:

`y[i] = -1 * parseInt(450 * Math.random());`
• 10-29-2012, 04:37 PM
ReFreezed
Just make their starting y-position random further outside the canvas. Try maybe y[i] = -21-450*Math.random();

X vBulletin 4.2.2 Debug Information

• Page Generation 0.10723 seconds
• Memory Usage 2,348KB
• Queries Executed 11 (?)
Template Usage (20):
• (3)bbcode_code_printable
• (1)footer
• (1)gobutton
• (1)navbar_moderation
• (1)navbar_noticebit
• (2)option
• (1)spacer_close
• (1)spacer_open

Phrase Groups Available (3):
• global
• postbit
Included Files (19):
• ./global.php
• ./includes/class_bootstrap.php
• ./includes/init.php
• ./includes/class_core.php
• ./includes/config.php
• ./includes/functions.php
• ./includes/class_friendly_url.php
• ./includes/class_hook.php
• ./includes/class_bootstrap_framework.php
• ./vb/vb.php
• ./vb/phrase.php
• ./includes/functions_calendar.php
• ./includes/class_bbcode_alt.php
• ./includes/class_bbcode.php
• ./includes/functions_bigthree.php
• ./includes/functions_notice.php

Hooks Called (41):
• init_startup
• init_startup_session_setup_start
• database_pre_fetch_array
• database_post_fetch_array
• init_startup_session_setup_complete
• global_bootstrap_init_start
• global_bootstrap_init_complete
• cache_permissions
• fetch_foruminfo
• global_state_check
• global_bootstrap_complete
• global_start
• style_fetch
• global_setup_complete
• bbcode_fetch_tags
• bbcode_create
• bbcode_parse_start
• bbcode_parse_complete_precache
• bbcode_parse_complete
• cache_templates
• cache_templates_process
• template_register_var
• template_render_output
• fetch_template_start
• fetch_template_complete
• parse_templates