繁体   English   中英

AFrame点击模型加载网址问题

AFrame click model load URL issue

提示:本站收集StackOverFlow近2千万问答,支持中英文搜索,鼠标放在语句上弹窗显示对应的参考中文或英文, 本站还提供   中文繁体   英文版本   中英对照 版本,有任何建议请联系yoyou2525@163.com。

我正在使用AR.js和Aframe,因此当我单击模型时,它将加载URL。

当我使用基本的盒子形状时,下面的方法工作正常,但是当我添加3D模型时,模型需要花费几秒钟的时间来加载,然后在加载后执行document.location.href函数,但是我只想在模型为点击?

<html>
    <head>
      <script src="https://aframe.io/releases/0.8.0/aframe.min.js"></script>
      <script src="https://cdn.rawgit.com/jeromeetienne/AR.js/1.6.0/aframe/build/aframe-ar.js"></script>

      <script>
        AFRAME.registerComponent('mas', {

          init: function () {
            var data = this.data;
            var el = this.el;  // <a-box>

            el.addEventListener('click', function () {
              console.log('click');
              masClick();
            });

            function masClick() {
              document.location.href = "http://www.google.com";
            };
          }
        });
      </script>

    </head>

    <body style='margin : 0px; overflow: hidden;'>

    <a-scene embedded arjs='sourceType: webcam;' cursor="rayOrigin: mouse">

      <a-entity rotation="0 90 0" dur="7000" mas>
        <a-gltf-model src="scene.gltf" scale="0.05 0.05 0.05" position='0 0.5 0' >
          <a-animation 
             dur="8000" 
             attribute="rotation" 
             to="0 360 0" 
             repeat="indefinite">
          </a-animation>   
        </a->
      </a-entity>

      <a-marker-camera preset='hiro'></a-marker-camera>
    </a-scene> 

    </body>
    </html>
1 个回复

cursor组件放在<a-marker>实体中时, cursor起作用:

<a-marker preset='hiro' cursor="rayOrigin: mouse">
  .....
</a-marker>

在这里 codepen。

1 Aframe - 通过点击拇指加载场景

我正在寻找通过点击拇指加载AFrame场景的方法。 我正在尝试使用图片滑块,每张图片后面都应该有一个3D场景。 因此,如果我单击滑块中的图片,则会在前景中弹出aframe场景,例如使用不同的天空纹理。 我尝试了多种方法,但没有任何方法可行。 我可以通过一个新窗口加载一个新场景,但这不是 ...

2017-04-23 15:24:17 1 215   aframe
2 Aframe和Angular2模型不会加载

我试图使用Angular加载aframe模型,但是在调用.obj和.mtl时,我看到的只是一个空白屏幕。 我还在控制台上收到一条警告,提示“ core:a-assets:warn资产加载在3000毫秒内超时”。 我也试过把'a-assets timeout =“ 10000”放进去; 但我 ...

3 Aframe 0.8.0无法加载某些GLTF模型

我一直在使用Aframe制作小型应用程序。 我遇到了一些来自Poly的未加载模型。 这里是链接: 模式1:Hill链接: https : //poly.google.com/view/biVS28j2w4g GLTF 2.0链接: https ://poly.googleus ...

2018-03-19 07:57:20 1 366   aframe
4 Aframe-react gltf2模型已加载但为空

我正在Aframe-react应用程序中加载gltf2模型,在检查器中该模型看起来已加载但显示为空。 .gltf 1.0,.gltf 2.0和.glb格式会发生这种情况。 它们在在线模型查看器中看起来不错,但在Aframe React应用中却没有显示。 加载模型 和 ...

6 为什么在Aframe中加载模型时会丢失.obj纹理?

我已经在Maya中创建了一个模型,然后将其导出为.obj文件。 Maya都创建了.obj和.mtl文件,但没有引用.mtl文件中的纹理图像,因此我在文件末尾手动添加了它,如下所示: map_Kd paht/to/texture_image/texture_image.png 当我将 ...

9 Aframe 如何在加载 GLTF 模型后重置默认比例

我正在尝试制作一个应用程序,它以 GLTF 格式从 Google poly 添加模型。 我遇到了一些模型在添加到场景中时非常大的问题,我通过使用边界框最大值和最小值计算它们的大小并设置缩放量来解决这个问题。 现在,当我打开检查器并拖动以缩放对象时,将对象添加到场景后,即使进行少量拖动,对象也会变 ...

10 Aframe自动缩放和自动居中加载模型

我一直在尝试制作一个应用程序,该应用程序可以使用Google Poly的模型并将其放在iframe中。 最初的问题是模型太大或太小,因此aframe社区向我建议了一种最佳方法,该方法可以工作一段时间,但在更改缩放比例和旋转度时会出错。 这是我用来确保模型正确缩放的组件。 上面 ...

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2022 STACKOOM.COM