PIXI
namespace PIXI
Summary
Properties from PIXI
|
|
|
| number |
|
| object |
|
| Array<PIXI.IResourcePlugin> |
|
| number |
|
| number |
|
| string |
|
| string |
|
| string |
|
Public Properties
static DATA_URI = undefined
Regexp for data URI. Based on: https://github.com/ragingwind/data-uri-regex
data:image/png;base64
static DEG_TO_RAD: number
Conversion factor for converting degrees to radians.
static GRAPHICS_CURVES: object
Graphics curves resolution settings. If adaptive flag is set to true,
the resolution is calculated based on the curve's length to ensure better visual quality.
Adaptive draw works with bezierCurveTo and quadraticCurveTo.
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
| adaptive | boolean |
<optional> |
true | flag indicating if the resolution should be adaptive |
| maxLength | number |
<optional> |
10 | maximal length of a single segment of the curve (if adaptive = false, ignored) |
| maxSegments | number |
<optional> |
2048 | maximal number of segments in the curve (if adaptive = false, ignored) |
| minSegments | number |
<optional> |
8 | minimal number of segments in the curve (if adaptive = false, ignored) |
static INSTALLED: Array<PIXI.IResourcePlugin>
Collection of installed resource types, class must extend PIXI.Resource.
class CustomResource extends PIXI.Resource {
// MUST have source, options constructor signature
// for auto-detected resources to be created.
constructor(source, options) {
super();
}
upload(renderer, baseTexture, glTexture) {
// upload with GL
return true;
}
// used to auto-detect resource
static test(source, extension) {
return extension === 'xyz'|| source instanceof SomeClass;
}
}
// Install the new resource type
PIXI.INSTALLED.push(CustomResource);
static RAD_TO_DEG: number
Conversion factor for converting radians to degrees.
Public Methods
autoDetectResource(source: string | unknown, options: object) → {PIXI.Resource}
Create a resource element from a single source element. This
auto-detects which type of resource to create. All resources that
are auto-detectable must have a static test method and a constructor
with the arguments (source, options?). Currently, the supported
resources for auto-detection include:
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
| source | string | unknown |
Resource source, this can be the URL to the resource, a typed-array (for BufferResource), HTMLVideoElement, SVG data-uri or any other resource that can be auto-detected. If not resource is detected, it's assumed to be an ImageResource. |
||
| options | object |
<optional> |
Pass-through options to use for Resource |
|
| options.width | number |
<optional> |
Width of BufferResource or SVG rasterization |
|
| options.height | number |
<optional> |
Height of BufferResource or SVG rasterization |
|
| options.autoLoad | boolean |
<optional> |
true |
Image, SVG and Video flag to start loading |
| options.scale | number |
<optional> |
1 |
SVG source scale. Overridden by width, height |
| options.createBitmap | boolean |
<optional> |
PIXI.settings.CREATE_IMAGE_BITMAP |
Image option to create Bitmap object |
| options.crossorigin | boolean |
<optional> |
true |
Image and Video option to set crossOrigin |
| options.autoPlay | boolean |
<optional> |
true |
Video option to start playing video immediately |
| options.updateFPS | number |
<optional> |
0 |
Video option to update how many times a second the texture should be updated from the video. Leave at 0 to update at every render |
| Type | Description |
|---|---|
| PIXI.Resource |
The created resource. |
autoDetectRenderer(options: object) → {PIXI.Renderer | PIXI.CanvasRenderer}
This helper function will automatically detect which renderer you should be using. WebGL is the preferred renderer as it is a lot faster. If WebGL is not supported by the browser then this function will return a canvas renderer
| Name | Type | Attributes | Default | Description |
|---|---|---|---|---|
| options | object |
<optional> |
The optional renderer parameters |
|
| options.width | number |
<optional> |
800 |
the width of the renderers view |
| options.height | number |
<optional> |
600 |
the height of the renderers view |
| options.view | HTMLCanvasElement |
<optional> |
the canvas to use as a view, optional |
|
| options.useContextAlpha | boolean |
<optional> |
true |
Pass-through value for canvas' context |
| options.autoDensity | boolean |
<optional> |
false |
Resizes renderer view in CSS pixels to allow for resolutions other than 1 |
| options.antialias | boolean |
<optional> |
false |
sets antialias |
| options.preserveDrawingBuffer | boolean |
<optional> |
false |
enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context |
| options.backgroundColor | number |
<optional> |
0x000000 |
The background color of the rendered area (shown if not transparent). |
| options.backgroundAlpha | number |
<optional> |
1 |
Value from 0 (fully transparent) to 1 (fully opaque). |
| options.clearBeforeRender | boolean |
<optional> |
true |
This sets if the renderer will clear the canvas or not before the new render pass. |
| options.resolution | number |
<optional> |
PIXI.settings.RESOLUTION |
The resolution / device pixel ratio of the renderer. |
| options.forceCanvas | boolean |
<optional> |
false |
prevents selection of WebGL renderer, even if such is present, this option only is available when using pixi.js-legacy or @pixi/canvas-renderer modules, otherwise it is ignored. |
| options.powerPreference | string |
<optional> |
Parameter passed to webgl context, set to "high-performance" for devices with dual graphics card webgl only |
| Type | Description |
|---|---|
| PIXI.Renderer | PIXI.CanvasRenderer |
Returns WebGL renderer if available, otherwise CanvasRenderer |
floatEqual(a: number, b: number, epsilon: number) → {boolean}
The idea of a relative epsilon comparison is to find the difference between the two numbers,
and see if it is less than a given epsilon.
A good epsilon would be the N% of the largest of the two values or Math.EPSILON.
Note: Only available with @pixi/math-extras.
| Name | Type | Description |
|---|---|---|
| a | number |
First floating number to compare. |
| b | number |
Second floating number to compare. |
| epsilon | number |
The epsilon to compare to. The larger the epsilon, the easier for the numbers to be considered equals. |
| Type | Description |
|---|---|
| boolean |
Returns |
lineIntersection(aStart: IPointData, aEnd: IPointData, bStart: IPointData, bEnd: IPointData, outPoint: IPointData) → {IPointData}
Computes the point where non-coincident and non-parallel Lines intersect.
Coincident or parallel lines return a NaN point {x: NaN, y: NaN}.
The intersection point may land outside the extents of the lines.
Note: Only available with @pixi/math-extras.
| Name | Type | Description |
|---|---|---|
| aStart | IPointData |
First point of the first line. |
| aEnd | IPointData |
Second point of the first line. |
| bStart | IPointData |
First point of the second line. |
| bEnd | IPointData |
Second point of the second line. |
| outPoint | IPointData |
A Point-like object in which to store the value, optional (otherwise will create a new Point). |
| Type | Description |
|---|---|
| IPointData |
The point where the lines intersect or a |
segmentIntersection(aStart: IPointData, aEnd: IPointData, bStart: IPointData, bEnd: IPointData, outPoint: IPointData) → {IPointData}
Computes the point where non-coincident and non-parallel segments intersect.
Coincident, parallel or non-intersecting segments return a NaN point {x: NaN, y: NaN}.
The intersection point must land inside the extents of the segments or return a NaN Point.
Note: Only available with @pixi/math-extras.
| Name | Type | Description |
|---|---|---|
| aStart | IPointData |
Starting point of the first segment. |
| aEnd | IPointData |
Ending point of the first segment. |
| bStart | IPointData |
Starting point of the second segment. |
| bEnd | IPointData |
Ending point of the second segment. |
| outPoint | IPointData |
A Point-like object in which to store the value, optional (otherwise will create a new Point). |
| Type | Description |
|---|---|
| IPointData |
The point where the segments intersect or a |