Cubo 3d com Javascript Canvas API.

Last update: Feb 4, 2022

Related tags

Overview

Projection engine

Motor gráfico escrito em javascript "from scratch".

Esse projeto não faz uso algum de NENHUMA API para renderização gráfica (como WebGL), tudo é feito do zero usando o contexto 2D do canvas e muita matemática.

Features

Suporte a modelos no formato .obj com as faces dos triângulos.
Shader básico baseado no normal do triângulo.
Rotação X, Y e Z.
FOV e Aspect ratio.
Clipping.
Projeção de perspectiva baseado no FOV/AspectRatio e valores para Z próximo e Z distante.
Vertex highlight / wireframe.
Configuração de cores para vertex e wireframe.
Keybindings.
Sensibilidade dos controles.
Movimentação da câmera nos eixos X, Y e Z / Rotação da câmera
Geometry culling baseado no normal no triângulo.

Em desenvolvimento

Status	Implementação	Razão	Prioridade
[x]	Index buffer	Performance	Alta
[ ]	Vertex buffer	Performance	Alta
[ ]	Depth buffer	Performance	Alta
[ ]	Suporte a multi-thread	Performance	Alta
[ ]	Suporte a processamento de shaders na GPU	Performance / escalabilidade	Alta
[ ]	Texturas	Visual	Média
[ ]	Inputs melhorados	Visual	Média
[x]	Yaw e pitch da câmera	Visual	Alta

Domvas implements the missing piece that connects the DOM and Canvas.

Domvas Overview Domvas implements the missing piece that connects the DOM and Canvas. It gives to the ability to take arbitrary DOM content and paint

Dec 29, 2022

Generates an image from a DOM node using HTML5 canvas

DOM to Image What is it dom-to-image is a library which can turn arbitrary DOM node into a vector (SVG) or raster (PNG or JPEG) image, written in Java

Jan 3, 2023

Phaser is a fun, free and fast 2D game framework for making HTML5 games for desktop and mobile web browsers, supporting Canvas and WebGL rendering.

Phaser - HTML5 Game Framework Phaser is a fast, free, and fun open source HTML5 game framework that offers WebGL and Canvas rendering across desktop a

Jan 7, 2023

This project is built with JavaScript, Webpack, HTML & CSS, Leaderboard api. When user clicks on Refresh button it hits the api and responds with the data, The user can also post data to the api

leaderboad Description the project. this project is about the leaderboad i did during Microverse to build a website for adding Data to the API and fet

May 30, 2022

Comments

Performance
[x] Análisar soluções para index buffer.

[ ] Análisar soluções para vertex buffer.

[ ] Multi-thread suporte com web workers.

[ ] Integração com GPU

[ ] gpu.js

[ ] Definir pipeline

[ ] Otimização dos métodos utilizados para processamento de matrizes.

enhancement
opened by FacoBackup 0

Cubo 3d com Javascript Canvas API.

Related tags

Overview

Projection engine

Features

Em desenvolvimento

You might also like...

Domvas implements the missing piece that connects the DOM and Canvas.

Generates an image from a DOM node using HTML5 canvas

Phaser is a fun, free and fast 2D game framework for making HTML5 games for desktop and mobile web browsers, supporting Canvas and WebGL rendering.

Framework for HTML5 Canvas oriented 2D video games

The (extremely) lightweight alternative to the mmenu.js plugin for creating off-canvas mobile menus.

A lib for text highlighting by using Canvas.

Snake game developed by Canvas & vanilla Js using OOP paradigm 🐍 🍎 🎮

👾 Simple creating cards using canvas. Welcome, Rank, Info and so on.

This project is built with JavaScript, Webpack, HTML & CSS, Leaderboard api. When user clicks on Refresh button it hits the api and responds with the data, The user can also post data to the api

Comments

Performance

Owner

Projection Engine

a 2D html canvas shooting game, implemented using vanilla JavaScript

The Javascript and canvas port of MarkovJunior : A Probabilistic Programming Language.

The Easel Javascript library provides a full, hierarchical display list, a core interaction model, and helper classes to make working with the HTML5 Canvas element much easier.

A graphical web-based audio visualizer which reads music data using Pure JavaScript, and draws a graphical view in Canvas.

Happy Birthday is a web-based party live background generated by CANVAS powered by JavaScript. This show a lot of random colorize particles in the background.

Canvas-based JavaScript UI element implementing touch, keyboard, mouse and scroll wheel support.

Pure JavaScript HTML5 Canvas Range Slider. No stylesheet needed. Simple, elegant and powerful. A quirky alternative to other sliders.

I made countdown birthday and fireworks animation using HTML Canvas, CSS, JS. The fireworks animation gonna come out once the countdown is finished or in other words, "Birthday Time".

This package generates a unique ID/String for different browsers. Like chrome, Firefox and any other browsers which supports canvas and audio Fingerprinting.

Clone of the Fallout hacking mini-game, rendered into a browser canvas.