2D Space

Developer
Josep Antoni Bover Comas
Size
2,506 Kb
Views
32,384
  1. 2D Space Previews
  2. 2D Space HTML Codes
  3. 2D Space JS Codes

How do I make an 2d space?

What is a 2d space? How do you make a 2d space? This script and codes were developed by Josep Antoni Bover Comas on 27 August 2022, Saturday.

2D Space Previews
IQ Test

2D Space - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>2D Space</title>
</head>
<body> <!-- Simplified object for 2D and THREE.js canvas (designed for my web page banners and for doing tests with them) -->
<!-- Can work in 2 ways, normal / test mode, and banner mode (for my web page headers) -->
<script src='https://devildrey33.es/Ejemplos/Utils/ObjetoCanvas.js'></script>
<link rel='stylesheet' href='https://devildrey33.es/Ejemplos/Utils/ObjetoCanvas.css'></link> <script src="js/index.js"></script>
</body>
</html>

2D Space - Script Codes JS Codes

/* Banner que simula un espacio en 2d a alta velocidad, creado por Josep Anotni Bover Comas el 06/07/2013 para devildrey33.es */
var Banner_Espacio2D = function() { // Llamo al constructor del ObjetoCanvas if (ObjetoCanvas.call(this, { 'Tipo' : '2d', 'Ancho' : 'Auto', 'Alto' : 'Auto', 'Entorno' : 'Normal', 'MostrarFPS' : true, 'ElementoRaiz' : document.body }) === false) { return false; } // Arrays para cada plano this.Estrellas = []; this.TotalEstrellas = ((this.Ancho * this.Alto) / 250); // Creo el array de estrellas for (var i = 0; i < this.TotalEstrellas; i++) { var Vel = Rand(5) + 0.5; var Col = 199 + Math.floor(Vel * 10); this.Estrellas[i] = new this.Estrella(RandInt(this.Ancho), RandInt(this.Alto), Vel, "rgb("+ Col + "," + Col + "," + Col + ")"); } this.Cargando(false);
};
Banner_Espacio2D.prototype = Object.assign( Object.create(ObjetoCanvas.prototype) , { constructor : Banner_Espacio2D, // Datos de la animación [requerido] Nombre : "Espacio 2D", IdeaOriginal : "devildrey33", URL : "http://devildrey33.es/Blog/Canvas2D_1", NombreURL : "Tutorial HTML5 Canvas2D parte 1", // Función que se llama al redimensionar el documento Redimensionar : function() { }, // Función que se llama al hacer scroll en el documento Scroll : function() { }, // Función que pinta cada frame de la animación Pintar : function() { this.Context.fillStyle = 'rgba(49, 46, 53, 0.4)'; this.Context.fillRect(0, 0, this.Ancho, this.Alto); for (i = 0; i < this.TotalEstrellas; i++) { this.Estrellas[i].X -= this.Estrellas[i].Velocidad; // Se ha salido del recuadro if (this.Estrellas[i].X < 0) { var Vel = Rand(5) + 0.5; var Col = 199 + Math.floor(Vel * 10); this.Estrellas[i] = new this.Estrella(this.Ancho, RandInt(this.Alto), Vel, "rgb("+ Col + "," + Col + "," + Col + ")"); } this.Context.fillStyle = this.Estrellas[i].Color; this.Context.fillRect(this.Estrellas[i].X, this.Estrellas[i].Y, 1, 1); } }, Estrella : function(X, Y, Velocidad, Color) { this.X = X; this.Y = Y; this.Velocidad = Velocidad; this.Color = Color; }
});
var Canvas = null;
window.addEventListener('load', function() { Canvas = new Banner_Espacio2D; });
2D Space - Script Codes
2D Space - Script Codes
Home Page Home
Developer Josep Antoni Bover Comas
Username devildrey33
Uploaded August 27, 2022
Rating 3
Size 2,506 Kb
Views 32,384
Do you need developer help for 2D Space?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Josep Antoni Bover Comas (devildrey33) Script Codes
Name
Hex Tunnel 0.5
CSS Loader Cassette
ObjetoAnimacion
Simple geometry
Adiestramiento de cubos
CSS menu concept
3D Rgb Spyral
3D Audio Analyzer
ObjetoCanvas y ObjetoLogo
Hex Tunnel 1.0
Create amazing SEO content with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!