From ec3eeccd18d755df7552c827f60730016958eacb Mon Sep 17 00:00:00 2001 From: liabru Date: Thu, 8 Apr 2021 00:31:31 +0100 Subject: [PATCH] add docs for all Matter.Render options --- src/render/Render.js | 198 ++++++++++++++++++++++++++++++++++++++++--- 1 file changed, 185 insertions(+), 13 deletions(-) diff --git a/src/render/Render.js b/src/render/Render.js index f1efaa79..fc33c3e0 100644 --- a/src/render/Render.js +++ b/src/render/Render.js @@ -1,5 +1,5 @@ /** -* The `Matter.Render` module is a simple HTML5 canvas based renderer for visualising instances of `Matter.Engine`. +* The `Matter.Render` module is a simple canvas based renderer for visualising instances of `Matter.Engine`. * It is intended for development and debugging purposes, but may also be suitable for simple games. * It includes a number of drawing options including wireframe, vector with support for sprites and viewports. * @@ -1424,6 +1424,38 @@ var Mouse = require('../core/Mouse'); * @default null */ + /** + * A `Bounds` object that specifies the drawing view region. + * Rendering will be automatically transformed and scaled to fit within the canvas size (`render.options.width` and `render.options.height`). + * This allows for creating views that can pan or zoom around the scene. + * You must also set `render.options.hasBounds` to `true` to enable bounded rendering. + * + * @property bounds + * @type bounds + */ + + /** + * The 2d rendering context from the `render.canvas` element. + * + * @property context + * @type CanvasRenderingContext2D + */ + + /** + * The sprite texture cache. + * + * @property textures + * @type {} + */ + + /** + * The mouse to render if `render.options.showMousePosition` is enabled. + * + * @property mouse + * @type mouse + * @default null + */ + /** * The configuration options of the renderer. * @@ -1433,6 +1465,7 @@ var Mouse = require('../core/Mouse'); /** * The target width in pixels of the `render.canvas` to be created. + * See also the `options.pixelRatio` property to change render quality. * * @property options.width * @type number @@ -1441,12 +1474,39 @@ var Mouse = require('../core/Mouse'); /** * The target height in pixels of the `render.canvas` to be created. + * See also the `options.pixelRatio` property to change render quality. * * @property options.height * @type number * @default 600 */ + /** + * The [pixel ratio](https://developer.mozilla.org/en-US/docs/Web/API/Window/devicePixelRatio) to use when rendering. + * + * @property options.pixelRatio + * @type number + * @default 1 + */ + + /** + * A CSS background color string to use when `render.options.wireframes` is disabled. + * This may be also set to `'transparent'` or equivalent. + * + * @property options.background + * @type string + * @default '#14151f' + */ + + /** + * A CSS background color string to use when `render.options.wireframes` is enabled. + * This may be also set to `'transparent'` or equivalent. + * + * @property options.wireframeBackground + * @type string + * @default '#14151f' + */ + /** * A flag that specifies if `render.bounds` should be used when rendering. * @@ -1456,27 +1516,139 @@ var Mouse = require('../core/Mouse'); */ /** - * A `Bounds` object that specifies the drawing view region. - * Rendering will be automatically transformed and scaled to fit within the canvas size (`render.options.width` and `render.options.height`). - * This allows for creating views that can pan or zoom around the scene. - * You must also set `render.options.hasBounds` to `true` to enable bounded rendering. + * A flag to enable or disable rendering entirely. * - * @property bounds - * @type bounds + * @property options.enabled + * @type boolean + * @default false */ /** - * The 2d rendering context from the `render.canvas` element. + * A flag to toggle wireframe rendering otherwise solid fill rendering is used. * - * @property context - * @type CanvasRenderingContext2D + * @property options.wireframes + * @type boolean + * @default true */ /** - * The sprite texture cache. + * A flag to enable or disable sleeping bodies indicators. * - * @property textures - * @type {} + * @property options.showSleeping + * @type boolean + * @default true + */ + + /** + * A flag to enable or disable the debug information overlay. + * + * @property options.showDebug + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the collision broadphase debug overlay. + * + * @property options.showBroadphase + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body bounds debug overlay. + * + * @property options.showBounds + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body velocity debug overlay. + * + * @property options.showVelocity + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body collisions debug overlay. + * + * @property options.showCollisions + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the collision resolver separations debug overlay. + * + * @property options.showSeparations + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body axes debug overlay. + * + * @property options.showAxes + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body positions debug overlay. + * + * @property options.showPositions + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body angle debug overlay. + * + * @property options.showAngleIndicator + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body and part ids debug overlay. + * + * @property options.showIds + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body vertex numbers debug overlay. + * + * @property options.showVertexNumbers + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body convex hulls debug overlay. + * + * @property options.showConvexHulls + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the body internal edges debug overlay. + * + * @property options.showInternalEdges + * @type boolean + * @default false + */ + + /** + * A flag to enable or disable the mouse position debug overlay. + * + * @property options.showMousePosition + * @type boolean + * @default false */ })();