Communitygithub.com

melonjs/melonjs-3d

用于在 melonJS 中处理所有 3D 或 2.5D 内容的技能 — 涵盖 Camera3d、Mesh、InstancedMesh、Sprite3d 公告板、Light3d、地面阴影、glTF/GLB 场景以及深度排序。

melonjs-3d 是什么?

melonjs/melonjs-3d 技能专为 melonJS 框架中任何 3D 或 2.5D 功能而设计,支持 Camera3d、Mesh、InstancedMesh、Sprite3d 公告板、Light3d、地面阴影、glTF/GLB 场景导入以及深度排序等核心 3D 特性。它基于 melonJS 独特的 Y-down/+Z-forward 右手坐标系(与 OpenGL 的 Z-up 相反),并介绍了通过 cameraClass 配置启用 3D 渲染的方式、裁剪平面的设置方法,以及 Canvas 回退模式下不支持的 3D 功能。这款技能适用于 Claude Code、Cursor、Codex 等 AI 编码助手,为开发者处理 3D 场景、网格对象、光照、公告板、雾效和透明度等任务时提供即时的参考与指导。触发关键词包括 Camera3d、Mesh、InstancedMesh、Sprite3d、Light3d、billboard、glTF、glb、3D、2.5D、depth、cameraClass、fov、setClipPlanes、setFog、fog、distance fog、height fog、heightFalloff、transparent、transparency、alpha、blendMode、fade、castGroundShadow、lit。

兼容平台~Claude Code~Codex CLI~Cursor
npx skills add https://github.com/melonjs/melonJS/tree/master/packages/melonjs/skills/melonjs-3d

在你喜欢的 AI 中提问

打开一个已预加载此 Agent Skill 的新对话。

文档

melonjs-3d 是做什么的?

使用此技能处理 melonJS 中的任何 3D 或 2.5D 内容 — Camera3d、Mesh、InstancedMesh、Sprite3d 公告板、Light3d、地面阴影、glTF/GLB 场景以及深度排序。涵盖了 Y-down/+Z-forward 约定(这是 OpenGL 的逆序)、cameraClass 选择加入、裁剪平面以及 Canvas 回退模式下不支持的功能。触发关键词:Camera3d、Mesh、InstancedMesh、Sprite3d、Light3d、billboard、glTF、glb、3D、2.5D、depth、cameraClass、fov、setClipPlanes、setFog、fog、distance fog、height fog、heightFalloff、transparent、transparency、alpha、blendMode、fade、castGroundShadow、lit。

Individual skills in this repo

This repo contains 10 individual skills — each has its own dedicated page.

melonjs/melonjs-3d-assets

Use this skill when loading 3D models into melonJS — glTF and GLB scenes, OBJ/MTL models, materials, imported lights, node animation, ground shadows and GPU instancing. Covers level.load options including the async flag, the rightHanded conversion, and exactly what the loader does and does not support. Triggers on: glTF, gltf, glb, OBJ, MTL, 3D model, getGLTF, getOBJ, getMTL, GLTFModel, GLTFScene, level.load glb, rightHanded, lightIntensityScale, castGroundShadow, shadowGroundY, EXT_mesh_gpu_instancing, KHR_lights_punctual, skinning, Blender export, 3D asset.

melonjs/melonjs-camera-and-drawing

Use this skill for camera control and immediate-mode drawing in melonJS — following a target, viewport bounds, shake and fade, secondary cameras, and drawing shapes, lines and gradients inside a custom draw(). Covers world versus screen coordinate conversion, clipping and masking, and baking with CanvasRenderTarget. Triggers on: Camera2d, viewport, follow, setBounds, shake, fadeIn, fadeOut, worldToLocal, localToWorld, colorMatrix, renderer.fill, renderer.stroke, Rect, Ellipse, Polygon, Line, Gradient, clipRect, mask, CanvasRenderTarget, NoiseTexture2d.

melonjs/melonjs-effects-and-shaders

Use this skill for post-processing effects, custom shaders, blend modes and colour grading in melonJS. Covers the built-in ShaderEffect presets, addPostEffect on renderables and cameras, writing a custom dual-language GLSL/WGSL effect, the screen_texture builtins, and why effects silently do nothing on the Canvas fallback. Triggers on: ShaderEffect, addPostEffect, removePostEffect, getPostEffect, VignetteEffect, GlowEffect, BlurEffect, PixelateEffect, ScanlineEffect, shader, GLSL, WGSL, uniform, setUniform, setTexture, setTime, blendMode, colorMatrix, screen_texture, toFrameTexture, post effect, filter.

melonjs/melonjs-loading-assets

Use this skill for loading and managing game assets in melonJS — the resource descriptor format, the full asset type list, preload versus load, retrieving loaded assets, base URLs and cross-origin settings, and the loading screen. Triggers on: loader, loader.preload, loader.load, resources, getImage, getJSON, getTMX, getGLTF, getVideo, getFont, setBaseURL, setOptions, crossOrigin, withCredentials, credentials, cookies, authenticated assets, CORS, asset, preload, LOADER_COMPLETE, loading screen, unload.

melonjs/melonjs-performance

Use this skill when a melonJS game drops frames, allocates heavily, or needs to scale to many objects. Covers object pooling, draw-call batching, atlases, baking with CanvasRenderTarget, instancing, culling and alwaysUpdate, the debug plugin, and where the real costs are. Triggers on: performance, slow, frame rate, fps, lag, pool, pool.register, pool.pull, batching, draw calls, InstancedMesh, culling, alwaysUpdate, inViewport, CanvasRenderTarget, optimise, profiling, debug plugin, memory.

melonjs/melonjs-physics

Use this skill for collision, physics bodies, movement, and spatial queries in melonJS — the built-in SAT world and the planck/matter adapters. Covers bodyDef vs Body, collision types and masks, the collision callback family and their firing rules, raycast/queryAABB/querySphere, and the behaviour differences between adapters. Triggers on: Body, bodyDef, collision, collisionType, collisionMask, onCollision, onCollisionStart, onCollisionActive, raycast, queryAABB, querySphere, PlanckAdapter, MatterAdapter, gravity, velocity, applyForce, isGrounded, SAT.

melonjs/melonjs-renderables

Use this skill when subclassing Renderable, writing a custom draw() method, handling pointer or click events on game objects, applying post effects and shaders, or controlling draw order. Covers the pos-relative draw contract, isKinematic and input, addPostEffect vs the deprecated shader property, and z-ordering. Triggers on: Renderable, extends Renderable, draw(, update(, isKinematic, pointerEvent, registerPointerEvent, onClick, addPostEffect, removePostEffect, ShaderEffect, addChild, z-order, anchorPoint, floating.

melonjs/melonjs-renderer-backends

Use this skill when a feature works on one machine and not another, when choosing or pinning a renderer, or when writing code that must degrade gracefully. Covers the WebGPU to WebGL 2 to Canvas fallback ladder, what each backend supports, capability detection, and the subsystems that warn once and then stop working on Canvas. Triggers on: video.AUTO, video.WEBGPU, video.WEBGL, video.CANVAS, renderer.type, supportsDepthBuffer, shaderLanguage, WebGPU, WebGL2, Canvas fallback, context loss, backen

melonjs/melonjs-scenes-and-state

Use this skill for scene structure and game flow in melonJS — Stage subclasses, the state manager, transitions, pausing, the update loop, timers and tweens. Covers onResetEvent versus the constructor, state.set before state.change, the camera and world lifecycle per stage, and pause-aware timing. Triggers on: Stage, state, state.set, state.change, state.transition, state.pause, onResetEvent, onDestroyEvent, onActivateEvent, onDeactivateEvent, PLAY, MENU, LOADING, update loop, GAME_UPDATE, timer, setTimeout, setInterval, Tween, freeze.

melonjs/melonjs-ui-and-text

Use this skill for HUDs, buttons, menus, dialogue panels and on-screen text in melonJS. Covers UIBaseElement/UISpriteElement/UITextButton, Draggable and DropTarget, the floating screen-space container pattern, Text and BitmapText, web font loading, and NineSliceSprite panels. Triggers on: UI, HUD, button, UIBaseElement, UISpriteElement, UITextButton, Draggable, DropTarget, menu, dialogue, Text, BitmapText, font, fontface, wordWrapWidth, NineSliceSprite, score display, floating.

相关技能