# Zjbcool-css3d
这类拼图能够将网页嵌入3D场景,比如,你可以把B站视频嵌入到3D场景中,将B站作为免费的视频托管平台。
css3d能够将任何页面元素嵌入3D场景,包括:文字、图片、视频、网站。
提示
CSS3D插件需要开启背景透明。在Init选项卡中,使用configure application拼图,勾选背景透明。
# create css3d object
创建CSS3D物体,它能够将一个<iframe>
元素绑定到一个三维面片上,从而嵌入到Verge3D场景中。
参数:
- name: CSS3D物体名称
- iframe: 要嵌入的
<iframe>
元素 - width: iframe和三维面片的宽度
- height: iframe和三维面片的高度
- scale: 缩放系数,仅控制三维面片的缩放
- render: 渲染模式,单面渲染和双面渲染
- display: 显示模式,最终渲染、固有色、线框
如果想把B站或youtube视频嵌入到3D场景,只需将视频嵌入代码复制进iframe参数。视频嵌入代码可以从视频的分享链接获得。
<iframe src="//player.bilibili.com/player.html?aid=15986493&bvid=BV16x411E7fY&cid=26085431&page=1" scrolling="no" border="0" frameborder="no" framespacing="0" allowfullscreen="true"> </iframe>
1
# remove css3d object
删除已经创建的css3d物体。
# iframe controls
该拼图可以开启/关闭iframe嵌套页面的交互。
以下拼图可以实现鼠标移入时开启交互;移出时自动关闭。移动设备需要使用when clicked事件。
# 更新
# 20210210 v 1.4
- 重写了整个插件,精减了拼图数量,移除
load script、create scene、css3d render拼图; - 改进create css3d object拼图,增加了display参数,便于在预览窗口内显示;
- css3d物体现在支持when hoved事件;
- 交互控制拼图更名为iframe controls;
- 支持verge3d 3.6+
# 20210119 v 1.3
- 不再需要在三维软件中单独创建“面片”,而是由create css3d object拼图生成;
- create css3d object拼图改进:
- 增加width、height、scale参数,用于控制css3d物体的尺寸和缩放;
- 可以使用物体分类下的hide/show拼图显示/隐藏css3d物体;
- 可以使用set transform拼图和copy transform控制css3d的位置和旋转。
- 移除
render css3d拼图和update css3d transform拼图
# 20201128 v 1.2
支持Verge3D 3.6版新增的创建物体(create object)拼图,CSS3D插件可以通过该拼图创建的面片(Plane)物体生成CSS3D物体。
# 20201128 v 1.1
Blender、3dsMax (包括Maya)中不再需要改变坐标轴,但是导出前仍然需要应用缩放。
# 20201124 v 1.0
CSS3D 插件1.0版发布。