Displays GL Transmission Format (gITF) 3D models.
<script async custom-element="amp-3d-gltf" src="https://cdn.ampproject.org/v0/amp-3d-gltf-0.1.js"></script>
amp-3d-gltf component displays 3D models that are in gITF format.
Note: A WebGL capable browser is required to display these models.
<amp-3d-gltf layout="responsive" width="320" height="240" alpha="true" antialiasing="true" src="path/to/model.glb" ></amp-3d-gltf>
Currently, only works with glTF 2.0.
- embeded cameras
amp-3d-gltf makes a
fetch request from the origin
access-control-allow-origin: *.ampproject.net must be set on the response header of the endpoint specified as
src. Wildcard is needed since the origin has a random sub-domain component to it.
|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 |
|antialiasing [optional]||A Boolean attribute that specifies whether to turn on antialiasing. Default value is |
|clearColor [optional]||A string that must contain valid CSS color, that will be used to fill free space on canvas.|
|maxPixelRatio [optional]||A numeric value that specifies the upper limit for the pixelRatio render option. The default is |
|autoRotate [optional]||A Boolean attribute that specifies whether to automatically rotate the camera around the model's center. Default value is |
|enableZoom [optional]||A Boolean attribute that specifies whether to turn on zoom. Default value is |
|setModelRotation(x, y, z, xMin, xMax, yMin, yMax, zMin, zMax)||sets model rotation. rotation order is ZYX |
See amp-3d-gltf rules in the AMP validator specification.
You've read this document a dozen times but it doesn't really cover all of your questions? Maybe other people felt the same: reach out to them on Stack Overflow.Go to Stack Overflow Found a bug or missing a feature?
The AMP project strongly encourages your participation and contributions! We hope you'll become an ongoing participant in our open source community but we also welcome one-off contributions for the issues you're particularly passionate about.Go to GitHub