/** * A renderable object for displaying textured triangle meshes. * Supports loading from Wavefront OBJ models (via `loader.preload` with type "obj") * or from raw geometry data (vertices, uvs, indices). * Includes a built-in perspective projection and supports 3D transforms * through the standard Renderable API (`rotate`, `scale`, `translate`). * Works on both WebGL (hardware depth testing) and Canvas (painter's algorithm) renderers. * @category Game Objects */ export default class Mesh extends Renderable { /** * @param {number} x - the x screen position of the mesh object * @param {number} y - the y screen position of the mesh object * @param {object} settings - Configuration parameters for the Mesh object * @param {string} [settings.model] - name of a preloaded OBJ model (via loader.preload with type "obj") * @param {Float32Array|number[]} [settings.vertices] - vertex positions as x,y,z triplets (alternative to settings.model) * @param {Float32Array|number[]} [settings.uvs] - texture coordinates as u,v pairs (alternative to settings.model) * @param {Uint16Array|number[]} [settings.indices] - triangle vertex indices (alternative to settings.model) * @param {HTMLImageElement|TextureAtlas|string} [settings.texture] - the texture to apply (image name, HTMLImageElement, or TextureAtlas). If omitted and settings.material is provided, the texture is resolved from the MTL material's map_Kd. * @param {string} [settings.material] - name of a preloaded MTL material (via loader.preload with type "mtl"). When provided, the diffuse texture (map_Kd), tint color (Kd), and opacity (d) are automatically applied. * @param {number} settings.width - display width in pixels (the 3D model is normalized and scaled to fit this size) * @param {number} settings.height - display height in pixels (the 3D model is normalized and scaled to fit this size) * @param {boolean} [settings.cullBackFaces=true] - enable backface culling * @example * // create from OBJ + MTL (texture auto-resolved from material) * let mesh = new me.Mesh(0, 0, { * model: "fox", * material: "fox", * width: 200, * height: 200, * }); * * // create from OBJ with explicit texture (no MTL needed) * let mesh = new me.Mesh(0, 0, { * model: "cube", * texture: "cube_texture", * width: 200, * height: 200, * }); * * // 3D rotation using the standard rotate() API * mesh.rotate(Math.PI / 4, new me.Vector3d(0, 1, 0)); // rotate around Y axis * * // 2D rotation (Z axis, same as Sprite) * mesh.rotate(Math.PI / 4); */ constructor(x: number, y: number, settings: { model?: string | undefined; vertices?: number[] | Float32Array | undefined; uvs?: number[] | Float32Array | undefined; indices?: number[] | Uint16Array | undefined; texture?: string | HTMLImageElement | TextureAtlas | undefined; material?: string | undefined; width: number; height: number; cullBackFaces?: boolean | undefined; }); /** * the original (untransformed) vertex positions as x,y,z triplets * @type {Float32Array} */ originalVertices: Float32Array; /** * texture coordinates as u,v pairs * @type {Float32Array} */ uvs: Float32Array; /** * number of vertices * @type {number} */ vertexCount: number; /** * the projected vertex positions, updated each draw call * @type {Float32Array} */ vertices: Float32Array; /** * whether to cull back-facing triangles * @type {boolean} * @default true */ cullBackFaces: boolean; /** * the texture atlas used by this mesh * @type {TextureAtlas} */ texture: TextureAtlas; /** * Projection matrix applied automatically before the model transform in draw(). * Defaults to a perspective projection (45° FOV, camera at z=-2.5) suitable for * viewing unit-cube-sized geometry. Set to identity for orthographic (flat) projection. * Most users don't need to modify this — the default works for standard OBJ models. * @type {Matrix3d} */ projectionMatrix: Matrix3d; /** @ignore */ _hullPoints: Vector2d[]; /** @ignore */ _hullPolygon: Polygon | null; /** * Project all vertices through projectionMatrix × currentTransform * and store the results in `this.vertices`. * @param {number} [offsetX=0] - x offset added to each projected vertex * @param {number} [offsetY=0] - y offset added to each projected vertex * @param {number} [zScale=0] - scale factor for Z output (0 = skip Z, 1000 = depth buffer range) * @ignore */ _projectVertices(offsetX?: number, offsetY?: number, zScale?: number): void; /** * Draw the mesh (automatically called by melonJS). * Projects vertices through projectionMatrix × currentTransform and calls renderer.drawMesh(). * @param {CanvasRenderer|WebGLRenderer} renderer - a renderer instance */ draw(renderer: CanvasRenderer | WebGLRenderer): void; /** * Render the mesh at its current state (transforms, projection, tint) to an offscreen canvas. * The returned canvas can be used with `renderer.drawImage()`, as a `Sprite` image source, * or converted to an ImageBitmap via `createImageBitmap()`. * @returns {HTMLCanvasElement} an offscreen canvas containing the rendered mesh * @example * // snapshot the mesh and create a Sprite from it * const canvas = mesh.toCanvas(); * const sprite = new me.Sprite(100, 100, { image: canvas }); * * // or draw directly * renderer.drawImage(mesh.toCanvas(), 100, 100); */ toCanvas(): HTMLCanvasElement; /** * Render the mesh at its current state to an ImageBitmap. * Useful for creating textures or sprites from the rendered mesh. * @returns {Promise} a promise that resolves to an ImageBitmap of the rendered mesh * @example * const bitmap = await mesh.toImageBitmap(); * const sprite = new me.Sprite(100, 100, { image: bitmap }); */ toImageBitmap(): Promise; } import Renderable from "./renderable.js"; import { TextureAtlas } from "./../video/texture/atlas.js"; import { Matrix3d } from "../math/matrix3d.ts"; import { Vector2d } from "../math/vector2d.ts"; import { Polygon } from "../geometries/polygon.ts"; import type CanvasRenderer from "./../video/canvas/canvas_renderer.js"; import type WebGLRenderer from "./../video/webgl/webgl_renderer.js"; //# sourceMappingURL=mesh.d.ts.map