JSFiddle - React, Tailwind, and code Playground

by confile

HTML

<script src="https://github.com/GoodBoyDigital/pixi.js/releases/download/v1.6.1/pixi.js"></script>

CSS

body {
		    margin: 0;
		    padding: 0;
		    background-color: #999;
	}

JavaScript

// create an new instance of a pixi stage
	var stage = new PIXI.Stage(0xFFFF99);

	// create a renderer instance
	//var renderer = new PIXI.WebGLRenderer(400, 300);//autoDetectRenderer(400, 300);
    var renderer = new PIXI.autoDetectRenderer(500, 800);
console.log("renderer type: "+renderer.type);

	// add the renderer view element to the DOM
	document.body.appendChild(renderer.view);

// ###
// add background image to stage
// ###

var bgImageUrl = "https://dl.dropboxusercontent.com/u/47067729/Fenster.JPG";

var bgTexture = PIXI.Texture.fromImage(bgImageUrl);
var bgImageSprite = new PIXI.Sprite(bgTexture); 

stage.addChild(bgImageSprite);
// render the stage
requestAnimFrame(anfn);

function anfn() {
    requestAnimFrame(anfn);
    renderer.render(stage);
}



// ###
// add sprite SVG to stage
// ###

var spriteContainer = new PIXI.DisplayObjectContainer();
//	spriteContainer.position.x = window.innerWidth/2;
//	spriteContainer.position.y = window.innerHeight/2;

//	spriteContainer.scale.set( window.innerWidth / 1100)
//	stage.addChild(spriteContainer);

//	spriteContainer.addChild(strip);

var spriteImageEinzelUrl = "https://dl.dropboxusercontent.com/u/47067729/Sailboat.svg";

var spriteImageUrl =  "https://dl.dropboxusercontent.com/u/47067729/spriteSailboat.svg";

var spriteSVGTexture = PIXI.Texture.fromImage(spriteImageEinzelUrl);
var spriteSVG = new PIXI.Sprite(spriteSVGTexture);
spriteSVG.position.set(10, 100);

console.log(spriteSVG.scale.set(2));
//spriteSVG.width = 800;
//spriteSVG.height = 800;

stage.addChild(spriteSVG);

///////
///////
///////


	requestAnimFrame( animate );


	// create a texture from an image path
var bunnyUrl = "http://www.goodboydigital.com/pixijs/examples/1/bunny.png";
	var texture = PIXI.Texture.fromImage(bunnyUrl);
	// create a new Sprite using the texture
	var bunny = new PIXI.Sprite(texture);

	// center the sprites anchor point
	bunny.anchor.x = 0.5;
	bunny.anchor.y = 0.5;

	// move the sprite t the center of the...