在 Seriously.js 中调整相机显示的大小

Question

我正在尝试在画布 DOM 元素中调整相机显示的大小。我尝试过使用事件监听器，并且能够毫无问题地调整画布大小。然而，相机的视频源并没有更新其大小，t 保持与初始化时相同。为了让它工作，我必须基本上破坏大部分组合，然后在每次调整窗口大小时重新初始化整个东西。它有效，但丑陋。有没有人有更好的解决方案？也许有一种方法可以让这个更优雅？感谢您的任何意见。

    window.addEventListener( 'resize', onWindowResize, false );
        function onWindowResize() {
        // seriously
        reformat = null
        source = null
        target.destroy()
        target = null
        seriously = new Seriously();
        canvas.width = window.innerWidth * devicePixelRatio;
        canvas.height = window.innerHeight * devicePixelRatio;
        var source = seriously.source('camera');
        target = seriously.target('#canvas'); 
        reformat = seriously.transform('reformat');
        reformat.source = source;
        reformat.width = canvas.width;
        reformat.height = canvas.height;
        target.source = reformat


        seriously.go(function(now) {
        var minutes;

        minutes = now / 6000;
        console.log("running")
        // split.angle = (minutes - Math.floor(minutes)) * PI2;
        // split.split = Math.cos(now / 1000) / 2 + 0.5;
    });

Answer 1

在遍历每个 Seriously 示例后，我找到了一个简单的解决方案。

   var devicePixelRatio = window.devicePixelRatio || 1;

    function resize() {
      target.width = window.innerWidth * devicePixelRatio;
      target.height = window.innerHeight * devicePixelRatio; 
      reformat.width = target.width;
      reformat.height = target.height;
    } 

    window.onresize = resize;