平面着色器(fss.js)的大小为100%

Flat Surface Shader (fss.js) size to 100%?

本文关键字:小为 100% js fss 平面      更新时间:2023-09-26

我正在一个响应式网站上工作,因此需要给画布100%的垂直和水平宽度-但它不知何故不起作用。我发现可以在

的脚本窗口中更改h和w的一些值。
var geometry = new FSS.Plane(600, 400, 6, 4);

但不幸的是,它没有百分比。

  1. 演示:http://jsfiddle.net/99DS3/1/
  2. Demo: http://codepen.io/wouwi/pen/Apvaq(其他人尝试了svg版本,并以某种方式使其达到100%)

编辑:我已经尝试将画布CSS的w和h设置为100%(即使是!important) -没有工作。

如果您只是擦除画布并重新创建平面呢?

相关JS:

function resize() {
    var width = container.offsetWidth, // No need to query these twice, when in an onresize they can be expensive
        height = container.offsetHeight;
    renderer.setSize(width, height);
    scene.remove(mesh); // Remove the mesh and clear the canvas
    renderer.clear();
    geometry = new FSS.Plane(width, height, 6, 4); // Recreate the plane and then mesh
    mesh = new FSS.Mesh(geometry, material);
    scene.add(mesh); // Readd the mesh
}
演示:

http://jsfiddle.net/SO_AMK/99DS3/3/