微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

流式传输 HTML 画布内容的最简单方法是什么

如何解决流式传输 HTML 画布内容的最简单方法是什么

我创建了简单的 beam.io.Write(beam.io.WritetoText( file_path_prefix=os.path.join(OUTPUT_DIR),file_name_suffix='.csv',header='colname1,colname2') ) 元素来绘制字符串 canvas

"Hello World"

我可以使用 MediaStream

从此 <!DOCTYPE html> <html> <body> <canvas id="myCanvas" width="200" height="100" style="border:1px solid #d3d3d3;"> Your browser does not support the HTML canvas tag.</canvas> <script> var c = document.getElementById("myCanvas"); var ctx = c.getContext("2d"); ctx.font = "30px Arial"; ctx.fillText("Hello World",10,50); </script> </body> </html> 创建 HTMLCanvasElement.captureStream()
canvas

我如何使用此 // Find the canvas element to capture var canvasElt = document.querySelector('myCanvas'); // Get the stream var stream = canvasElt.captureStream(25); // 25 FPS // Do things to the stream Now 来观看 VLC 或 YouTube/Facebook 直播?

我想 MediaRecorder 会帮助我,但我不知道如何。
我找到了 https://github.com/fbsamples/Canvas-Streaming-Example,但这看起来并不容易。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。