-
Notifications
You must be signed in to change notification settings - Fork 1
Scene Object
SoJS coder edited this page Dec 9, 2023
·
3 revisions
const scene = new Scene(opts)
-
option
s (Object, optional): An object containing various configuration options for the scene.-
width
(Number, optional): The width of the scene canvas. Default is 500. -
height
(Number, optional): The height of the scene canvas. Default is 500. -
canvas
(HTMLCanvasElement, required): The HTML canvas element to render the scene. -
fpsMonitoringEnabled
(Boolean, optional): Enable or disable FPS (Frames Per Second) monitoring. Default is false. -
lighting
(Boolean, optional): Enable or disable lighting effects. Default is false. -
update
(Function, optional): Custom update function for the scene. Default is an empty function. -
GPUsettings
(Object, optional): GPU settings for GPU acceleration. -
physics
(Boolean, optional): Enable or disable physics simulation. Default is false. -
physicsOptions
(Object, optional): Configuration options for the Matter.js physics engine. -
start
(Boolean, optional): If true, the draw method will be called immediately after the scene is created.
-
-
width
(Number): The width of the scene canvas. -
height
(Number): The height of the scene canvas. -
objects
(Array): An array to store objects in the scene. -
canvas
(HTMLCanvasElement): The HTML canvas element used for rendering. -
ctx
(CanvasRenderingContext2D): The 2D rendering context of the canvas. -
collisionMonitors
(Array): An array to store collision monitoring objects. -
cameraAngle
(Array): An array representing the camera angle. -
fpsBuffer
(Array): An array to store FPS values for monitoring. -
fpsMonitoringEnabled
(Boolean): Indicates whether FPS monitoring is enabled. -
lastFrameStamp
(Number): Timestamp of the last frame rendering. -
lastPhysicsUpdate
(Number): Timestamp of the last physics update. -
lighting
(Boolean): Indicates whether lighting effects are enabled. -
id
(String): A unique identifier for the scene. -
update
(Function): The custom update function for the scene. -
lights
(Array): An array to store lighting objects. -
gpu
(Object): An instance of the GPU.js library for GPU acceleration. -
diffuseKernel
(Kernel): GPU.js kernel for lighting calculations. -
physics
(Boolean): Indicates whether physics simulation is enabled. -
Engine
(Object): Matter.js Engine object for physics simulation. -
Bodies
(Object): Matter.js Bodies object for creating physics bodies. -
Composite
(Object): Matter.js Composite object for managing physics bodies. -
engine
(Object): The Matter.js engine instance.
-
addLight(light)
: adds alight
object to the scene -
formatLights()
: returns a 1D array containing all light information -
diffuseLights(ambient, fog)
: diffuses the lights in the scene, with ambient lightambient
.fog
is used for non linearization of the light source. Play around with this number -
setBoundaries(rightBound, bottomBound, activate)
: Set the scene's boundaries. Only active ifactivate
is true (default) -
disableBounds()
: disables the scene's bounds -
activateBounds()
: activates the scene's bounds -
addObject(object)
: addsobject
to the scene (object must be of typeGameObject
-
clear()
: clears the scene -
draw(clear, ambient, fog)
: draws the scene. Only clears the previous frame ifclear
is true (defualt). If in optionsstart
is set to false, calldraw()
to start the rendering.ambient
andfog
are passed todiffuseLights
iflighting
is set to true in options -
removeObject(object)
: removes specified object from the scene (object must be of typeGameObject
) -
enableCollisionsBetween(object1, object2, onFunction, offFunction)
: enables collisions between two objects in the scene (object1
andobject2
).onFunction
fires once when the objects collide,offFunction
fires once when the objects stop colliding -
bindCamera(object)
: binds the scene's camera toobject
's position (object must be aGameObject
) -
unbindCamera()
: unbinds the camera from previously bound object -
cameraTo(object)
: moves the camera toobject
's position. To keep it there every frame, usebindCamera
-
moveCamera(vector)
: moves the camera according tovector
-
enableFPS()
: enables FPS counter on top left of canvas -
disableFPS()
: disables FPS counter on top left of canvas
const sceneOptions = {
width: 800,
height: 600,
canvas: document.getElementById("sceneCanvas"),
fpsMonitoringEnabled: true,
lighting: true,
update: customUpdateFunction,
GPUsettings: { mode: 'gpu' },
physics: true,
physicsOptions: { gravity: { x: 0, y: 1 } },
start: true,
};
const myScene = new Scene(sceneOptions);