<a-image>
Note: This documentation is for the old 1.3.0 version of A-Frame. Check out the documentation for the current 1.6.0 version
The image primitive shows an image on a flat plane.
Example
<a-scene> |
Attributes
Attribute | Component Mapping | Default Value |
---|---|---|
color | material.color | #FFF |
height | geometry.height | 1 |
metalness | material.metalness | 0 |
opacity | material.opacity | 1 |
repeat | material.repeat | None |
roughness | material.roughness | 0.5 |
segments-height | geometry.segmentsHeight | 1 |
segments-width | geometry.segmentsWidth | 1 |
shader | material.shader | flat |
side | material.side | front |
src | material.src | None |
transparent | material.transparent | true |
width | geometry.width | 1 |
Fine-Tuning
Ensuring that the image is not distorted by stretching requires us to appropriately set the width
and height
preserving the original aspect ratio of the image. This properties are set in meters, don’t confuse with pixels.
For example, a 2:1 image:
<a-image src="#logo" width="3" height="1.5"></a-image> |