手册

参考

动画
- AnimationAction
- AnimationClip
- AnimationMixer
- AnimationObjectGroup
- AnimationUtils
- KeyframeTrack
- PropertyBinding
- PropertyMixer
动画 / 轨道
- BooleanKeyframeTrack
- ColorKeyframeTrack
- NumberKeyframeTrack
- QuaternionKeyframeTrack
- StringKeyframeTrack
- VectorKeyframeTrack
音频
- Audio
- AudioAnalyser
- AudioContext
- AudioListener
- PositionalAudio
摄像机
- 摄像机阵列（ArrayCamera）
- 摄像机（Camera）
- 立方相机（CubeCamera）
- 正交相机（OrthographicCamera）
- 透视相机（PerspectiveCamera）
- 立体相机（StereoCamera）
常量
- 动画常量（Animation Constants）
- 核心常量（Core Constants）
- 自定义混合方程常量（Custom Blending Equation Constants）
- 材质常量（Material Constants）
- WebGL渲染器常量（WebGLRenderer Constants）
- 纹理常量（Texture Constants）
核心
- BufferAttribute
- BufferGeometry
- Clock
- EventDispatcher
- GLBufferAttribute
- InstancedBufferAttribute
- InstancedBufferGeometry
- InstancedInterleavedBuffer
- InterleavedBuffer
- InterleavedBufferAttribute
- Layers
- 三维物体（Object3D）
- 光线投射Raycaster
- Uniform
核心 / BufferAttributes
- BufferAttribute Types
附件
- Earcut
- ImageUtils
- PMREMGenerator
- ShapeUtils
附件 / 核心
- Curve
- 曲线路径（CurvePath）
- 字体（Font）
- 插值（Interpolations）
- 路径（Path）
- 形状（Shape）
- 形状路径（ShapePath）
附件 / 曲线
- 弧线（ArcCurve）
- CatmullRomCurve3
- 二维三次贝塞尔曲线（CubicBezierCurve）
- 三维三次贝塞尔曲线（CubicBezierCurve3）
- 椭圆曲线（EllipseCurve）
- 二维线段曲线（LineCurve）
- 三维线段曲线（LineCurve3）
- 二维二次贝塞尔曲线（QuadraticBezierCurve）
- 三维二次贝塞尔曲线（QuadraticBezierCurve3）
- 样条曲线（SplineCurve）
附件 / 物体
- 即时渲染对象(ImmediateRenderObject)
几何体
- 立方缓冲几何体（BoxGeometry）
- 圆形缓冲几何体（CircleGeometry）
- 圆锥缓冲几何体（ConeGeometry）
- 圆柱缓冲几何体（CylinderGeometry）
- 十二面缓冲几何体（DodecahedronGeometry）
- 边缘几何体（EdgesGeometry）
- 挤压缓冲几何体（ExtrudeGeometry）
- 二十面缓冲几何体（IcosahedronGeometry）
- 车削缓冲几何体（LatheGeometry）
- 八面缓冲几何体（OctahedronGeometry）
- 参数化缓冲几何体（ParametricGeometry）
- 平面缓冲几何体（PlaneGeometry）
- 多面缓冲几何体（PolyhedronGeometry）
- 圆环缓冲几何体（RingGeometry）
- 形状缓冲几何体（ShapeGeometry）
- 球缓冲几何体（SphereGeometry）
- 四面缓冲几何体（TetrahedronGeometry）
- 文本缓冲几何体（TextGeometry）
- 圆环缓冲几何体（TorusGeometry）
- 圆环缓冲扭结几何体（TorusKnotGeometry）
- 管道缓冲几何体（TubeGeometry）
- 网格几何体（WireframeGeometry）
辅助对象
- ArrowHelper
- AxesHelper
- BoxHelper
- Box3Helper
- CameraHelper
- DirectionalLightHelper
- GridHelper
- PolarGridHelper
- HemisphereLightHelper
- PlaneHelper
- PointLightHelper
- SkeletonHelper
- SpotLightHelper
灯光
- AmbientLight
- 环境光探针（AmbientLightProbe）
- 平行光（DirectionalLight）
- 半球光（HemisphereLight）
- 半球光探针HemisphereLightProbe
- Light
- 光照探针LightProbe
- 点光源（PointLight）
- 平面光光源（RectAreaLight）
- 聚光灯（SpotLight）
灯光 / 阴影
- LightShadow
- PointLightShadow
- DirectionalLightShadow
- SpotLightShadow
加载器
- AnimationLoader
- AudioLoader
- BufferGeometryLoader
- Cache
- CompressedTextureLoader
- CubeTextureLoader
- DataTextureLoader
- FileLoader
- FontLoader
- ImageBitmapLoader
- ImageLoader
- 加载器（Loader）
- LoaderUtils
- MaterialLoader
- ObjectLoader
- TextureLoader
加载器 / 管理器
- DefaultLoadingManager
- LoadingManager
材质
- 基础线条材质（LineBasicMaterial）
- 虚线材质(LineDashedMaterial)
- 材质(Material)
- 基础网格材质(MeshBasicMaterial)
- 深度网格材质(MeshDepthMaterial)
- MeshDistanceMaterial
- Lambert网格材质(MeshLambertMaterial)
- MeshMatcapMaterial
- 法线网格材质(MeshNormalMaterial)
- Phong网格材质(MeshPhongMaterial)
- 物理网格材质(MeshPhysicalMaterial)
- 标准网格材质(MeshStandardMaterial)
- MeshToonMaterial
- 点材质(PointsMaterial)
- 原始着色器材质(RawShaderMaterial)
- 着色器材质(ShaderMaterial)
- 阴影材质(ShadowMaterial)
- 点精灵材质(SpriteMaterial)
数学库
- Box2
- Box3
- 颜色（Color）
- 圆柱坐标（Cylindrical）
- 欧拉角（Euler）
- 视锥体（Frustum）
- 插值器（Interpolant）
- 三维几何线段（Line3）
- 数学函数（MathUtils）
- 三维矩阵（Matrix3）
- 四维矩阵（Matrix4）
- 平面（Plane）
- 四元数（Quaternion）
- 射线（Ray）
- 球（Sphere）
- 球坐标（Spherical）
- SphericalHarmonics3
- 三角形（Triangle）
- 二维向量（Vector2）
- 三维向量（Vector3）
- 四维向量（Vector4）
数学库 / 插值
- 三次插值(CubicInterpolant)
- 离散插值(DiscreteInterpolant)
- 线性插值(LinearInterpolant)
- 四元数线性插值(QuaternionLinearInterpolant)
物体
- 骨骼（Bone）
- 组（Group）
- 实例化网格（InstancedMesh）
- 线（Line）
- 环线（LineLoop）
- 线段（LineSegments）
- 多细节层次（LOD，Levels of Detail）
- 网格（Mesh）
- 点（Points）
- 骨架（Skeleton）
- 蒙皮网格（SkinnedMesh）
- 精灵（Sprite）
渲染器
- WebGLMultipleRenderTargets
- WebGLMultisampleRenderTarget
- WebGLRenderer
- WebGL1Renderer
- WebGLRenderTarget
- WebGLCubeRenderTarget
渲染器 / 着色器
- ShaderChunk
- ShaderLib
- UniformsLib
- UniformsUtils
渲染器 / WebXR
- WebXRManager
场景
- 雾（Fog）
- 雾-指数（FogExp2）
- 场景（Scene）
纹理贴图
- Canvas纹理（CanvasTexture）
- 压缩的纹理（CompressedTexture）
- 立方纹理（CubeTexture）
- DataTexture
- DataTexture2DArray
- DataTexture3D
- 深度纹理（DepthTexture）
- 纹理（Texture）
- 视频纹理（VideoTexture）

示例

开发者参考

差异化支持
- 差异化支持(腻子)
WebGL 渲染器

文江博客开发文档 Three.js 官方中文文档文章详情

文章来源于网络收集而来，版权归原创者所有，如有侵权请及时联系！

CSS 3D渲染器（CSS3DRenderer）

发布于 2021-07-10 14:14:20 字数 1605 浏览 2551 评论 0 收藏 0

CSS3DRenderer用于通过CSS3的transform属性，将层级的3D变换应用到DOM元素上。如果你希望不借助基于canvas的渲染来在你的网站上应用3D变换，那么这一渲染器十分有趣。同时，它也可以将DOM元素与WebGL的内容相结合。

然而，这一渲染器也有一些十分重要的限制：

它不可能使用three.js中的材质系统。
同时也不可能使用几何体。

因此，CSS3DRenderer仅仅关注普通的DOM元素，这些元素被包含到了特殊的对象中（CSS3DObject或者CSS3DSprite），然后被加入到场景图中。

例子

molecules
orthographic camera
periodictable
sprites

构造函数

CSS3DRenderer()

方法

.getSize () : Object

返回一个包含有渲染器宽和高的对象。

.render ( scene : Scene, camera : PerspectiveCamera ) : null

使用perspective camera渲染scene。

.setSize (width : Number, height : Number) : null

将渲染器尺寸重新调整为(width, height)。

源代码

examples/jsm/renderers/CSS3DRenderer.js

收藏 0

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

列表为空，暂无数据

我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的隐私政策了解更多相关信息。单击 接受 或继续使用网站，即表示您同意使用 Cookies 和您的相关数据。

原文