在加载模型(.OBJ)的A帧中,模型在HIRO模式上增强时抖动(破碎的纹理)

时间:2018-08-16 14:08:23

标签: javascript html augmented-reality aframe web-deployment-project

我正在尝试使用A框架在OBJ MODEL (Car)标记Hiro上增强.obj(模型)(.PATT)

问题1) 在HIRO模式上增强时,Obj正在加载,但是obj纹理正在抖动(起伏,破裂),如图像中所示-{{3} },MODELEDGES ............从远处扫描图案时,抖动更多...

当我在3D Builder中打开模型时,正在呈现的模型中没有任何抖动或混乱,图像-BROKEN TEXTURES ON EDGESMODEL IN 3D BUILDR .....谁能帮助我加载模型而不会发生抖动(损坏的)模型,具有稳定性.....

要求: 在增强模型(.obj,.mtl)时,纹理不应抖动或破裂

问题2) 和另一个查询我们是否可以通过AWS S3存储桶中的URL通过URL加载.obj和.mtl文件。 ,我正在从本地存储中加载模型(ar_assets / model / .....)...我们可以从模型URL提取吗,我试过了,但没有用,是否有任何解决方案可以加载模型(。 URL中的obj,.mtl),模型的URL在带有注释行的代码中。

要求: 从插入本地存储的URL加载模型资源(.obj,.mtl,纹理)。

-----预先感谢

    <!DOCTYPE html>
        <html class="no-js" lang="en">
           <head>
              <meta charset="UTF-8">
              <meta name="author" content="AnilAr">
              <meta name="description" content="">
              <meta name="keywords" content="HTML,CSS,XML,JavaScript">
              <meta http-equiv="x-ua-compatible" content="ie=edge">
              <!-- Title -->
              <title>AR</title>
              <!-- AR.js by @jerome_etienne - github: https://github.com/jeromeetienne/ar.js - info: https://medium.com/arjs/augmented-reality-in-10-lines-of-html-4e193ea9fdbf -->
              <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 src="https://cdn.rawgit.com/donmccurdy/aframe-extras/v4.1.2/dist/aframe-extras.min.js"></script>
              <!-- <script src="//cdn.rawgit.com/donmccurdy/aframe-extras/v3.8.4/dist/aframe-extras.min.js"></script> -->
              <script src="https://rawgit.com/donmccurdy/aframe-extras/v2.1.1/dist/aframe-extras.loaders.min.js"></script>
              <!-- Latest compiled and minified CSS -->
              <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
           </head>
           <body style='margin : 0px; overflow: hidden;'>
              <div class="header">
                 <div class="row">
                    <div class="col-lg-6 col-md-6 col-sm-6 col-xs-6 pull-left">
                       <div  class="oneleft">
                          <div class="imgon">
                             <img class="imgss img-responsive" src="https://isl-web-res.s3.ap-south-1.amazonaws.com/augment/ar_patterns/mono_patterns/hiro.png">
                          </div>
                          <span class="imgname"> Scan Me </span>
                       </div>
                    </div>
                 </div>
              </div>
              </div>
              <a-scene shadow="type: pcfsoft" embedded arjs='sourceType: webcam; debugUIEnabled: false;'>
                 <a-assets>
                    <!-- RESOURCES FROM LOCAL STORAGE  -->
                    <a-asset-item id="tree-obj-1"  src="../ar_assets/models/audi_ar/Audia4interior/audia4inter.obj"></a-asset-item>
                    <a-asset-item  id="tree-mtl-1" src="../ar_assets/models/audi_ar/Audia4interior/audia4inter.mtl"></a-asset-item>
                    <!-- URL RESOURCES FOR .OBJ -->
                    <!-- <a-asset-item id="tree-obj-1"  src="https://isl-web-res.s3.ap-south-1.amazonaws.com/augment/ar_assets/models/audi_ar/Audia4interior/audia4inter.obj"></a-asset-item>
                       <a-asset-item  id="tree-mtl-1" src="https://isl-web-res.s3.ap-south-1.amazonaws.com/augment/ar_assets/models/audi_ar/Audia4interior/audia4inter.mtl"></a-asset-item>
                       -->
                 </a-assets>
                 <!-- <a-marker  type="pattern" url="https://isl-web-res.s3.amazonaws.com/augment/ar_patterns/mono_patterns/hiro.patt"> -->
                 <a-marker  type="pattern" url="../ar_assets/pattern/hiro.patt">
                    <a-entity obj-model="obj: #tree-obj-1; mtl: #tree-mtl-1" position="0 0 0" rotation="-90 0 -90" scale="0.1 0.1 0.1"></a-entity>
                 </a-marker>
                 <a-entity ></a-entity>
                 <a-entity camera></a-entity>
              </a-scene>
              <style>
                 .imgon{
                 width: 55px;
                 height: 55px;
                 background-color:white;
                 padding: 3px 2px 2px 2px !important;
                 }
                 .imgss{
                 width: 50px !important;
                 height:50px !important;
                 } 
                 .imgname{
                 font-size: 10px;
                 }
                 .header {
                 position: fixed;
                 left: 0;
                 top: 0;
                 width: 100%;
                 color: white;
                 }
                 .oneleft{
                 padding: 5px 5px 5px 5px;
                 margin: 5px 15px 5px 5px ;
                 float: left;
                 z-index: 900000000000;
                 }
                 #arjsDebugUIContainer{
                 display: none;
                 }
                 .a-enter-vr-button{
                 display: none !important;
                 }
              </style>
           </body>
        </html>

0 个答案:

没有答案