# Color problem

• 10-31-2012, 04:31 PM
jumbee
Color problem
Hi

I'm making a field of asteroids and try to change colors in two ways. Btw I'm a beginner with this. :)

First is to have all the androids colored randomly and second is two have them colored in lets say 3 different predefined colors.

Thanks guys...

Code:

```\$(document).ready(function() {         var canvas = \$("#myCanvas");         var context = canvas.get(0).getContext("2d");         var canvasWidth = canvas.width();         var canvasHeight = canvas.height();         \$(window).resize(resizeCanvas);         function resizeCanvas() {                 canvas.attr("width", \$(window).get(0).innerWidth);                 canvas.attr("height", \$(window).get(0).innerHeight);                 canvasWidth = canvas.width();                 canvasHeight = canvas.height();         };                 resizeCanvas();                 var playAnimation = true;         var startButton = \$("#startAnimation");         var stopButton = \$("#stopAnimation");         startButton.hide();         startButton.click(function() {                 \$(this).hide();                 stopButton.show();                 playAnimation = true;                 animate();         });         stopButton.click(function() {                 \$(this).hide();                 startButton.show();                 playAnimation = false;         });                 var Asteroid = function(x, y, radius, color) {                 this.x = x;                 this.y = y;                 this.radius = radius;                 this.color = color;                 this.vX = vX;                 this.vY = vY;         };         var asteroids = new Array();         for (var i = 0; i < 1000; i++) {                 var x = 20+(Math.random()*(canvasWidth-40));                 var y = 20+(Math.random()*(canvasHeight-40));                 var radius = 2+Math.random()*30;                 var vX = Math.random()*4-2;                 var vY = Math.random()*4-2;                 var color = 'rgb(' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ',' + (Math.floor(Math.random() * 256)) + ')';                 asteroids.push(new Asteroid(x, y, radius, vX, vY, color));                 };         function animate() {                 context.clearRect(0, 0, canvasWidth, canvasHeight);                        //context.fillStyle = "rgb(255, 255, 255)";                                 var asteroidsLength = asteroids.length;                 for (var i = 0; i < asteroidsLength; i++) {                         var tmpAsteroid = asteroids[i];                         tmpAsteroid.x += tmpAsteroid.vX;                         tmpAsteroid.y += tmpAsteroid.vY;                                                 if (tmpAsteroid.x-tmpAsteroid.radius < 0) {                                 tmpAsteroid.x = tmpAsteroid.radius;                                 tmpAsteroid.vX *= -1;                         } else if (tmpAsteroid.x+tmpAsteroid.radius > canvasWidth) {                                 tmpAsteroid.x = canvasWidth-tmpAsteroid.radius;                                 tmpAsteroid.vX *= -1;                         };                         if (tmpAsteroid.y-tmpAsteroid.radius < 0) {                                 tmpAsteroid.y = tmpAsteroid.radius;                                 tmpAsteroid.vY *= -1;                         } else if (tmpAsteroid.y+tmpAsteroid.radius > canvasHeight) {                                 tmpAsteroid.y = canvasHeight-tmpAsteroid.radius;                                 tmpAsteroid.vY *= -1;                         };                                                                         context.beginPath();                         context.arc(tmpAsteroid.x, tmpAsteroid.y, tmpAsteroid.radius, 0, Math.PI*2, false);                         context.closePath();                         context.fill();                 };                 if (playAnimation) {                         setTimeout(animate, 33);                 };         };                 animate(); });```
• 11-01-2012, 05:48 AM
deepode
Well, try this.
• 11-03-2012, 12:18 AM
rnd me
Code:

```function oneOfManyColors(){  var colors=["#ff6622", "#00ff00", "#0088ff", "#ff0000", "#ff8800"]; //and so on  return colors[ Math.floor(colors.length * Math.random()) ]; }```

## X vBulletin 4.2.2 Debug Information

• Page Generation 0.07285 seconds
• Memory Usage 2,372KB
• Queries Executed 11 (?)
Template Usage (20):
• (2)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
• cache_templates
• cache_templates_process
• template_register_var
• template_render_output
• fetch_template_start
• fetch_template_complete
• parse_templates