How to use @pixi/app - 9 common examples

{
            if (!this._loader && this._options)
            {
                const { sharedLoader } = this._options;

                this._loader = sharedLoader ? Loader.shared : new Loader();
            }

            return this._loader;
        },
    },
});

// Override the destroy function
// making sure to destroy the current Loader
Application.prototype._parentDestroy = Application.prototype.destroy;
Application.prototype.destroy = function destroy(removeView, stageOptions)
{
    if (this._loader)
    {
        this._loader.destroy();
        this._loader = null;
    }
    this._parentDestroy(removeView, stageOptions);
};

import { Application } from '@pixi/app';
import { Loader } from '@pixi/loaders';

Application.prototype._loader = null;

/**
 * Loader instance to help with asset loading.
 * @name PIXI.Application#loader
 * @type {PIXI.Loader}
 */
Object.defineProperties(Application.prototype, {
    loader: {
        get()
        {
            if (!this._loader && this._options)
            {
                const { sharedLoader } = this._options;

                this._loader = sharedLoader ? Loader.shared : new Loader();
            }

            return this._loader;
        },
    },
});

// Override the destroy function

if (!this._loader && this._options)
            {
                const { sharedLoader } = this._options;

                this._loader = sharedLoader ? Loader.shared : new Loader();
            }

            return this._loader;
        },
    },
});

// Override the destroy function
// making sure to destroy the current Loader
Application.prototype._parentDestroy = Application.prototype.destroy;
Application.prototype.destroy = function destroy(removeView, stageOptions)
{
    if (this._loader)
    {
        this._loader.destroy();
        this._loader = null;
    }
    this._parentDestroy(removeView, stageOptions);
};

const margin = resolution * (1 - scale) / 2;
			pathContainer.scale.set(scale, scale);
			pathContainer.position.set(margin, margin);
		}

		const pixiOpts = assign({}, pixiOptions);
		const { a, r, g, b } = config.backgroundColor;
		if (a > 0 && !config.transparentBackground) {
			assign(pixiOpts, {
				// eslint-disable-next-line no-bitwise
				backgroundColor: r << 16 ^ g << 8 ^ b << 0,
				transparent: a < 1
			});
		}

		const app = new PIXIApplication({
			width: resolution,
			height: resolution,
			...pixiOpts
		});

		const container = new Container();
		app.stage.addChild(container);

		const drawFn = drawPixi(this.state.drawFunction, pathContainer);
		const draw = drawFn(container, app);
		if (draw.update) {
			draw.update({
				sourceData,
				genes,
				title: config.showTitle && config.title,
				showLabels: !!config.showLabels,

import { useDeprecated } from './useDeprecated';

// Install renderer plugins
Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager);
Renderer.registerPlugin('extract', extract.Extract);
Renderer.registerPlugin('interaction', interaction.InteractionManager);
Renderer.registerPlugin('particle', ParticleRenderer);
Renderer.registerPlugin('prepare', prepare.Prepare);
Renderer.registerPlugin('batch', BatchRenderer);
Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer);

Loader.registerPlugin(BitmapFontLoader);
Loader.registerPlugin(SpritesheetLoader);

Application.registerPlugin(TickerPlugin);
Application.registerPlugin(AppLoaderPlugin);

/**
 * String of the current PIXI version.
 *
 * @static
 * @constant
 * @memberof PIXI
 * @name VERSION
 * @type {string}
 */
export const VERSION = '__VERSION__';

/**
 * @namespace PIXI
 */

// other module must call this manually
import { useDeprecated } from './useDeprecated';

// Install renderer plugins
Renderer.registerPlugin('accessibility', accessibility.AccessibilityManager);
Renderer.registerPlugin('extract', extract.Extract);
Renderer.registerPlugin('interaction', interaction.InteractionManager);
Renderer.registerPlugin('particle', ParticleRenderer);
Renderer.registerPlugin('prepare', prepare.Prepare);
Renderer.registerPlugin('batch', BatchRenderer);
Renderer.registerPlugin('tilingSprite', TilingSpriteRenderer);

Loader.registerPlugin(BitmapFontLoader);
Loader.registerPlugin(SpritesheetLoader);

Application.registerPlugin(TickerPlugin);
Application.registerPlugin(AppLoaderPlugin);

/**
 * String of the current PIXI version.
 *
 * @static
 * @constant
 * @memberof PIXI
 * @name VERSION
 * @type {string}
 */
export const VERSION = '__VERSION__';

/**
 * @namespace PIXI
 */

import { Application } from '@pixi/app';
import { Loader } from '@pixi/loaders';

Application.prototype._loader = null;

/**
 * Loader instance to help with asset loading.
 * @name PIXI.Application#loader
 * @type {PIXI.Loader}
 */
Object.defineProperties(Application.prototype, {
    loader: {
        get()
        {
            if (!this._loader && this._options)
            {
                const { sharedLoader } = this._options;

                this._loader = sharedLoader ? Loader.shared : new Loader();
            }

context.glVersion = 2;
					}
					if (!context) {
						context = view.getContext('webgl', glOpts) ||
							view.getContext('experimental-webgl', glOpts);
					}
				} catch (e) {}
			}

			assign(pixiOptions, {
				view,
				context
			});
		}

		const app = this.pixiApp = new PIXIApplication({
			width: width || window.innerWidth,
			height: height || window.innerHeight,
			...pixiOptions
		});
		patchPixiContext(app.renderer.context);

		this.wrapper.appendChild(app.view);
		this.wrapper.className = this.props.className || '';
		this.container = new Container();
		app.stage.addChild(this.container);

		this.sketch = sketch(this.container, app, otherProps);

		if (this.sketch.update) {
			this.sketch.update(otherProps);
		}

view = this.pixiApp.renderer.view;
				context = this.pixiApp.renderer.context;

				try {
					this.pixiApp.destroy();
				} catch (e) {}
			}

			const pixiOptions = assign({}, defaultPixiOptions, {
				view,
				context
			});

			pixiOptions.backgroundColor = hexColor(newProps.bgColor, pixiOptions.backgroundColor);

			const app = this.pixiApp = new PIXIApplication({
				width: width || window.innerWidth,
				height: height || window.innerHeight,
				...pixiOptions
			});
			patchPixiContext(app.renderer.context);
			this.wrapper.appendChild(app.view);
			this.container = new Container();
			app.stage.addChild(this.container);
			this.sketch = sketch(this.container, app, otherProps);
		}

		if (this.sketch.update) {
			this.sketch.update(otherProps);
		}

		if (this.props.sketch !== sketch ||