AMP-3D-GLTF

Description

Displays GL Transmission Format (gITF) 3D models.

Required Script

                            <script
                            async custom-element="amp-3d-gltf"
                            src="https://cdn.ampproject.org/v0/amp-3d-gltf-0.1.js"/>
                        

Supported Layouts

fill, fixed, fixed-height, flex-item, responsive

Usage

The amp-3d-gltf component displays 3D models that are in gITF format.
Note: A WebGL capable browser is required to display these models.

Example

                    <amp-3d-gltf
                    layout="responsive"
                    width="320"
                    height="240"
                    alpha="true"
                    antialiasing="true"
                    src="path/to/model.glb"/>
                

Limitations

Currently, only works with gLTF 2.0
Unsupported features:
  • embeded cameras
  • animation

Attributes

src [required]

A required attribute that specifies the URL to the gltf file.

alpha [optional]

A Boolean attribute that specifies whether free space on canvas is transparent. By default, free space is filled with black. Default value is false.

antialiasing [optional]

A Boolean attribute that specifies whether to turn on antialiasing. Default value is false.

maxPixelRatio [optional]

A numeric value that specifies the upper limit for the pixelRatio render option. The default is window.devicePixelRatio.

maxPixelRatio [optional]

A Boolean attribute that specifies whether to automatically rotate the camera around the model's center. Default value is false.

enableZoom [optional]

A Boolean attribute that specifies whether to turn on zoom. Default value is true.