我有一个360度的图像,我使用一帧来显示。
我的问题是,是否有任何交互性(如谷歌地图街景),我可以采取叠加箭头并将用户带到另一个360度图像?是否有可能做到这一点?如果有可能,我将如何添加此类功能?
是否可以在360图像上添加文字或html链接?
我意识到这不仅仅是一个问题,但希望有人可以帮助我。我真的很喜欢A-Frame。
答案 0 :(得分:1)
有多种方法可以实现您想要实现的目标。
360画廊(如谷歌地图街景):
最简单的方法是制作一个正在改变其源图像的球体/天空。示例here,教程here。
基本上,您使用<a-sky>
或<a-sphere>
的图片来源制作<a-sphere src="myImage.jpg">
或<a-sphere material="src:myImage.jpg">
。当然,您希望按钮遍布整个地方,而不是像示例中那样组织。
<强>链接
强>
我不确定添加普通链接,当然你可以添加任何实体,这会通过这样的javascript将你重定向到另一个页面:
在现场:
<a-entity link><a-entity>
@js:
AFRAME.registerComponent('link', {
init:function(){
this.el.addEventListener('click',function(){
window.location.href = "http://stackoverflow.com";
});
}
});
文字
强>
记录添加文本here。如果您不喜欢它,您可以随时使用Alpha通道制作图像,并将其添加到您喜欢的任何位置。
老实说,尝试制作360度图像,然后制作2D图片,然后处理某些行为(链接,切换图像)。