A-Frame <a-image> 在某些设备的某些浏览器上失真答案

【问题标题】：A-Frame <a-image> distorted on some browser in some deviceA-Frame <a-image> 在某些设备的某些浏览器上失真
【发布时间】：2018-08-28 18:08:50
【问题描述】：

图像在下面的设备浏览器上失真：

IOS：谷歌浏览器

Android：默认网络浏览器

我已经尝试了如下的缩放和宽度/高度，但仍然没有缩放或重新调整到我想要的正确尺寸。

<a-image width="1.365" height="2.2" position="0 0 -5" src="./chicken1.png" material="alpha-test: .5" shadow></a-image>

和

<a-image scale="1.7 1.35 1" position="0 0 -5" src="./chicken1.png" material="alpha-test: .5" shadow></a-image>

也是实际问题here的参考

【问题讨论】：

【解决方案1】：

检查图像的原始像素？

此外，在调整图像大小时，尽量保持图像的纵横比以消除失真，如果图像是 1280 x 720 像素，则尝试根据此调整大小，尽量不要拉伸/重塑图像。

我个人只会使用像 height="200px" 之类的像素来调整图像大小，并尝试在 CSS 中进行格式化。

【讨论】：

谢谢，我想我明白了，但在不同的浏览器之间仍然略有失真。由于 a-frame 正在使用画布中的图像，因此 CSS 格式也是不可能的。不过，感谢@connorg98！