渲染没有3D库的Skybox

时间:2013-11-03 10:29:01

标签: html5 canvas 3d skybox

所以...我有一些6张图片,比如这些http://www.humus.name/index.php?page=Textures,我基本上想要在html5画布上渲染它们,如下所示:http://www.allforthecode.co.uk/aftc/forum/user/modules/forum/article.php?index=5&subindex=4&aid=303 但我宁愿不使用任何3d库,例如webgl或three.js,因为这是我需要的唯一3D相关功能,我希望整个事情尽可能轻量级。 我想,“来吧,它只是一个旋转的立方体,不能那么难!” 错误。 我最初的计划是保持相机位置固定,然后跟踪每个顶点的x和y偏移(弧度),然后将它们投影到我的画布上并相应地变形上下文以渲染立方体的每个面。 这种方法似乎不起作用,所以...有人可以给我一个伪代码算法吗?

1 个答案:

答案 0 :(得分:0)

我认为解决这个问题的一个好方法是使用CSS3 3d转换。网上有很多可以找到有关如何使用CSS构建3d立方体的详细信息。您可以使用< img>而不是使用< div>来构建多维数据集的边。甚至< canvas>元素。通过使用透视属性,您应该能够将“相机”放在立方体内部。