Search the Community

Showing results for tags 'videobasetexture'.

More search options

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • HTML5 Game Coding
    • News
    • Game Showcase
    • Facebook Instant Games
    • Web Gaming Platform
    • Coding and Game Design
  • Frameworks
    • Phaser 3
    • Phaser 2
    • Pixi.js
    • Babylon.js
    • Panda 2
    • melonJS
  • General
    • General Talk
  • Business
    • Collaborations (un-paid)
    • Jobs (Hiring and Freelance)
    • Services Offered

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start



Website URL





Found 2 results

  1. Hi, I am trying to draw HLS video stream over PIXI video texture on iOS safari browser (iOS 11.2) referring but not succeeded. (Sorry for poor English as I am Japanese) When I set mp4 video as source, the demo code worked over iPhone + mobile safari (OS: 11.2). But when I set url of HLS (m3u8) and tapped play button, video did not drawn. I tried some change but not succeeded to play HLS stream over PIXI video texture. Below is my code, modified part of . ... function onPlayVideo() { // Don't need the button anymore button.destroy(); /// modify start // mp4 // (1) mp4 OK : video/audio played ( is my own server) // var texture = PIXI.Texture.fromVideo(''); // (2) mp4 OK : video/audio played // var texture = PIXI.Texture.fromVideoUrl(''); // HLS // (3) Not work : when play button pressed, loading m3u8 not started. // #http://184.72 ... is effective m3u8 stream // var texture = PIXI.Texture.fromVideo(''); // (4) Not work : when play button pressed, loading m3u8 not started. // var texture = PIXI.Texture.fromVideoUrl(''); // (5) Not work : when play button pressed, loading m3u8 started and audio play started. but video is not drawn on canvas. let baseVideoTexture = PIXI.VideoBaseTexture.fromUrl({ src: '', mime: 'application/' }); var texture = PIXI.Texture.from(baseVideoTexture); /// modify end // create a new Sprite using the video texture (yes it's that easy) var videoSprite = new PIXI.Sprite(texture); ... Please help/guide me regarding right way/manner to play HLS stream over video texture of PIXI. (i.e. how to fix above code) entire HTML which I modified is attached (pixi_video_hls.html) If more information needed for answer, let me know. Thank you in advance. pixi_video_hls.html
  2. I'm a bit of a Pixi-noob, set with the task of maintaining a Pixi-based solution.From what I've read, upgrading from v2 to v3 should be a walk in the park. This has not been my experience so far (possibly because of my limited Pixi skills). The problem I'm encountering at the moment is getting a video to play. Using Pixi.VideoTexture worked fine. But when I attempt to use the new Pixi.VideoBaseTexture I get this for every call to render(). TypeError: this.children[i].updateTransform is not a functionat Container.23.Container.updateTransform (pixi.js:6904:26)at CanvasRenderer.43.CanvasRenderer.render (pixi.js:12408:12)at animate (index.html:31:15)Below is the simple test that does not work. I have tried using both fromVideo and fromUrl.Does anyone have any working samplecode for using VideoBaseTexture?The doc at points to "the 'deus' demo", which is a v2 sample using Pixi.VideoTexture, and so is every other sample I have found. <!doctype html><div id="samplevideo"></div><video id="videoelement" width="200" height="200" style="display: none;"> <source src="sample.mp4" type="video/mp4"></video><script src="pixi.js"></script><script>//var videoTexture = PIXI.VideoBaseTexture.fromUrl('sample.mp4', PIXI.SCALE_MODES.DEFAULT);var videoTexture = PIXI.VideoBaseTexture.fromVideo(document.getElementById("videoelement"), PIXI.SCALE_MODES.DEFAULT);var imageTexture = new PIXI.Sprite.fromImage("sample.jpg");var stage = new PIXI.Container();stage.addChild(videoTexture);var rendererOptions = { antialiasing:true, transparent:true, resolution:1};var renderer = new PIXI.CanvasRenderer(200, 200, rendererOptions);document.getElementById("samplevideo").appendChild(renderer.view);function animate() { requestAnimationFrame (animate); try { renderer.render(stage); } catch(err) { console.error(err); }}requestAnimationFrame (animate);</script>