由于 AR.ImageResource 未加载本地图像，标记和雷达在 ARView 中不可见

Question

在我的 PhoneGap 应用程序中，我使用的是 Wikitude Cordova 插件 (5.1.1)，所有 Wikitude 功能都运行良好。现在我正在将我的插件更新到最新的 5.3.0 版本，但我们在 IOS 设备中遇到了 Wikitude 插件功能的一些问题。问题是：

当我在应用程序中加载 Wikitude ARView 时，所有标记和雷达都正确显示，但是当我使用 AR.context.destroyAll(); 从 ARView 中销毁所有对象时；之后，当我再次尝试在 ARView 上绘制雷达和制造商时，这些对象在 ARView 上不可见。我的应用程序具有我需要从 ARView 中清除所有标记并使用一些过滤器重新绘制标记的功能。

现在我找到了破坏后看不到标记和雷达的原因。

原因是 "AR.ImageResource" 在销毁后没有正确加载标记和雷达。 因为我为 AR.ImageResource 添加了 onLoaded 和 onError 回调。第一次加载 AR World 时，我收到了 "onLoadded" 回调的调用。但是当我在销毁后加载 ImageResouce 时，我收到了 "onError" 回调的调用，错误显示它在错误的路径中找到了图像。

我将 loadARchitectWorld 的 AR 体验 URL 用作： var arExperienceUrl = "www/main_home_ar_view_screen.html";

雷达图片资源使用的图片路径：www > img > wikitude_img > radar_bg.png

加载 AR.ImageResource 的代码：

AR.radar.background = new AR.ImageResource("img/wikitude_img/radar_bg.png", {
onLoaded : function successFn(loadedURL) {
           /* Respond to successful world loading if you need to */
            alert("onLoaded");                   
    },
onError : function errorFn(error) 
{
            alert("onError " + error + " & " +  error.message);
    }});

当我加载 AR World 时，上面的代码第一次运行良好。但是从 ARView 中销毁对象后，AR.ImageResource 在这个路径“/www/main_home_ar_view_screen.html/img/wikitude_img/radar_bg.png 找到图像”，由于在错误的路径找到图像，图像没有加载（见附件图片）。

我也找到了这些东西:

相同的代码在 Android 平台上运行良好。
如果我使用图像 URL（远程图像）和 AR.ImageResource，那么 iOS 上的一切都很好 also.That 意味着所有标记和雷达在销毁后正确显示在 ARView 上，但是当我将本地图像路径与 AR.ImageResource 一起使用时，标记和雷达在销毁后不会显示（当我使用本地图像路径加载 AR 世界时，标记和雷达会正确显示）。

请建议我如何解决本地图片路径的AR.ImageResouce问题。

Answer 1

要解决此问题，只需将以下代码片段粘贴到主 Architect .js 文件的顶部

AR.__resourceUrl = function(url) 
{
   if (/^([a-z\d.-]+:)?\/\//i.test(url)) 
   {
      // URL contains protocol and can be considered absolute
      return url;
   }
   // get protocol
   var protocol = document.baseURI.substring(0,
   document.baseURI.indexOf('/') + 2);
   var uri = document.baseURI.substring(document.baseURI.indexOf('/') +    2);
    // remove fragment identifier
    if ( uri.indexOf('#') > 0 && uri.length > uri.indexOf('#') +1 ) {
        uri = uri.substring(0, uri.lastIndexOf('#'));
        // in case there was a '/' after the fragment identifier, we need to add it back again
        if ( uri[uri.length - 1] !== '/' ) {
            uri += '/';
        }
    }
    // remove trailing file (edge case, this is just a domain e.g.
    // www.google.com)
    uri = uri.substring(0, uri.lastIndexOf('/') + 1);
    var baseUrl = protocol + uri;
    if (baseUrl[baseUrl.length - 1] !== '/')
    baseUrl += '/';
    if (url[0] === '/') {
    // url references root
    baseUrl = baseUrl.substring(0, baseUrl.indexOf('/', baseUrl
 .indexOf('//') + 2));
    }
    var resourceURL = baseUrl + url;
    return resourceURL;
};

当我从 Wikitude 开发者论坛得到这个解决方案时

由于 AR.ImageResource 未加载本地图像，标记和雷达在 ARView 中不可见

Markers and Radar are not visible in ARView Due to AR.ImageResource not load local images

ios

wikitude

cordova