JavaScript - Elaborar el código que permita crear gráficos aleatoriamente.

 
Vista:
sin imagen de perfil

Elaborar el código que permita crear gráficos aleatoriamente.

Publicado por daniel (6 intervenciones) el 14/11/2021 21:02:32
Hola!
Quería ver si me podrian apoyar con este trabajo. Soy nuevo en esto y se me esta dificultando.

Las instrucciones son las siguentes:

Al revisar las presentaciones y después de lo revisado durante el curso y en actividades anteriores, ya sabemos cómo crear algunas formas geométricas con JavaScript, vamos a intentar crear una obra de arte digital.

Para crear esto, debemos generar figuras aleatorias en nuestra pantalla usando canvas y modificando su posición y tamaño.

También debes utilizar la paleta de colores que te proporcionamos. Es un arreglo llamado colores. Debes utilizar estos colores también de manera aleatoria.

var colores = ['aqua', 'black', 'blue', 'fuchsia', 'gray', 'green', 'lime', 'maroon', 'navy', 'olive', 'orange', 'purple', 'red', 'silver', 'teal', 'white', 'yellow'];


Muchas gracias de ante mano c:
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
-1
Responder
Imágen de perfil de Alejandro
Val: 1.448
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Elaborar el código que permita crear gráficos aleatoriamente.

Publicado por Alejandro (532 intervenciones) el 16/11/2021 16:53:25
  • Alejandro se encuentra ahora conectado en el
  • chat de PHP
¿Qué es lo que se te dificulta?
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
sin imagen de perfil

Elaborar el código que permita crear gráficos aleatoriamente.

Publicado por daniel (6 intervenciones) el 17/11/2021 06:23:06
Hola, pues hasta el momento llevo esto, nomas que ya no se en que estoy mal :c

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
window.onload = init;
window.onresize = init;
 
var stage;
 
function init()
{
	stage = new createjs.Stage("lienzo");
  canvas = document.getElementById('lienzo');
  canvas.width = window.innerWidth;
  canvas.height = window.innerHeight;
	crearCirculosAleatorios();
}
 
function crearCirculosAleatorios()
{
	var circle_temp;
	var x,y,r,color;
  var width = stage.canvas.width;
  var height = stage.canvas.height;
 
	for(var i=0;i<300;i++)
	{
		x = Math.random()*width;
		y = Math.random()*height;
		r = Math.random()*50;
		color = colorAleatorio();
		circle_temp = crearCirculo(x,y,r,color);
		stage.addChild(circle_temp);
	}
	stage.update();
}
function colorAleatorio(){
  var r = Math.round(Math.random()*255);
  var g = Math.round(Math.random()*255);
  var b = Math.round(Math.random()*255);
  return "rgb("+r+","+g+","+b+")";
}
function crearCirculo(x,y,radio,color)
{
	var circle = new createjs.Shape();
	circle.graphics.beginFill(color);
	circle.graphics.drawCircle(0, 0, radio);
	circle.x = x;
	circle.y = y;
	return circle;
}
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar
Imágen de perfil de Alejandro
Val: 1.448
Plata
Ha mantenido su posición en JavaScript (en relación al último mes)
Gráfica de JavaScript

Elaborar el código que permita crear gráficos aleatoriamente.

Publicado por Alejandro (532 intervenciones) el 17/11/2021 17:40:20
  • Alejandro se encuentra ahora conectado en el
  • chat de PHP
He probado tu código y funciona.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
<canvas id="lienzo"></canvas>
<script src="https://code.createjs.com/1.0.0/createjs.min.js"></script>
<script>
	window.onload = init;
	window.onresize = init;
 
	var stage;
 
	function init(){
		stage = new createjs.Stage("lienzo");
		canvas = document.getElementById('lienzo');
		canvas.width = window.innerWidth;
		canvas.height = window.innerHeight;
		crearCirculosAleatorios();
	}
 
	function crearCirculosAleatorios(){
		var circle_temp;
		var x,y,r,color;
		var width = stage.canvas.width;
		var height = stage.canvas.height;
 
		for(var i=0;i<300;i++){
			x = Math.random()*width;
			y = Math.random()*height;
			r = Math.random()*50;
			color = colorAleatorio();
			circle_temp = crearCirculo(x,y,r,color);
			stage.addChild(circle_temp);
		}
		stage.update();
	}
 
	function colorAleatorio(){
		var r = Math.round(Math.random()*255);
		var g = Math.round(Math.random()*255);
		var b = Math.round(Math.random()*255);
		return "rgb("+r+","+g+","+b+")";
	}
 
	function crearCirculo(x,y,radio,color){
		var circle = new createjs.Shape();
		circle.graphics.beginFill(color);
		circle.graphics.drawCircle(0, 0, radio);
		circle.x = x;
		circle.y = y;
		return circle;
	}
</script>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar