JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/pixi.js/4.8.3/pixi.min.js"></script>
    <div id="drawletter_container">
    </div>

JavaScript

// create canvas renderer and container
var element = document.getElementById('drawletter_container')
var renderer = new PIXI.CanvasRenderer(984, 428, {antialias: true, transparent: true, multiTexture: false, enableDebug: false})
element.appendChild(renderer.view)
var container = new PIXI.Container()

// create sprite with the well known godzilla mask icon
var sprite = new PIXI.Sprite(PIXI.Texture.fromImage('https://i.kinja-img.com/gawker-media/image/upload/s--fbE5h4t0--/c_scale,fl_progressive,q_80,w_800/1501840081290294050.jpg'))
sprite.width = 984
sprite.height = 428
container.addChild(sprite)

// create a graphics polygon line
var points = [new PIXI.Point(493.4, 0.8), new PIXI.Point(335, 385.1)]
var graphics = new PIXI.Graphics()
graphics.beginFill(0x00aeef)
graphics.lineStyle(20, 'transparent')
graphics.drawPolygon(new PIXI.Polygon(points))
container.addChild(graphics)

// add polygon line as mask
sprite.mask = graphics
pixiAnimate()



function pixiAnimate () {
	requestAnimationFrame(pixiAnimate)
	renderer.render(container)
}