如何在 SparkAR Studio 98 中将跟踪平面上的对象定向到相机?

2024-01-08

我正在寻找一种方法,通过 SparkAR Studio 98 中的脚本将跟踪平面上的场景对象定向到相机。 这听起来微不足道,但我很难找到相机的世界位置,然后从中生成一个旋转,我可以将其应用于看着相机的对象。

我让它在跟踪平面层次结构中工作,这样一个对象总是会看着另一个对象,但由于相机位于该层次结构和坐标系之外,所以它对我没有帮助。

一如既往,我一直在努力解决 SparkAR API 的反应性问题,而且事实是,事物分布在多个坐标系上,而且信息很难在网上找到,而且很快就会过时。 我的代码如下所示:

const Scene = require('Scene');
const R = require('Reactive');
export const Diagnostics = require('Diagnostics');

(async function () {
    Diagnostics.log("Filter activated");

    const objectToOrient = await Scene.root.findFirst('object');
    const objectParent= await Scene.root.findFirst('objectParent');
    const target = await Scene.root.findFirst('target');

    const lookAtPt = R.point(
        target.worldTransform.x,
        target.worldTransform.y,
        target.worldTransform.z);

    const lookAtTransform = objectParent.transform.lookAt(lookAtPt);
})();

为了向读者说明这个概念,我设置了这个场景:

一旦跟踪到底层平面,就会出现“S”。然后它与被跟踪的飞机一起保持在原位。 然后它应该始终朝向相机/设备/用户旋转。 谢谢你!


实际上,还有另一种简单的方法可以做到这一点lookAt方法。它的工作方式似乎有点不同——它总是将对象旋转到世界空间中的相机位置,而不是将相机旋转绑定到对象旋转。

const Scene = require('Scene');

(async function () {

    const camera = await Scene.root.findFirst('Camera');
    const tracker = await Scene.root.findFirst('planeTracker');
    const plane = await Scene.root.findFirst('plane');

    // Get the camera world space position
    const cameraPositionSignal = tracker.worldTransform.inverse().applyToPoint(camera.worldTransform.position);

    // Apply the rotation of the relative transform between plane tracker and camera world position
    plane.transform.rotation = tracker.transform.lookAt(cameraPositionSignal).rotation;

    // Bring object back to the plane tracker origin
    plane.worldTransform.position = tracker.worldTransform.position;

})();

大概,lookAtSpark AR Studio 98 处于活动状态时,该方法无法正常工作。这适用于当前最新的 120 版本。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在 SparkAR Studio 98 中将跟踪平面上的对象定向到相机? 的相关文章

  • 在 Angular 中使用 Vue 组件

    我有一个用 Vue 构建的项目 我想在 Angular 应用程序中重用 Vue 应用程序中的组件 这样我就不必从头开始重建每个组件 我在medium上看到了这个教程 如何在 Angular 应用程序中使用 Vue 2 0 组件 https
  • angularjs:如何向资源对象添加缓存?

    在 http 中添加缓存非常简单 通过传递cache true http docs angularjs org api ng http https docs angularjs org api ng service 24http有缓存选项
  • chrome 调试器承诺在暂停时不会解析?

    也许我没有正确调试承诺 但基本上 如果您在断点处停止并运行异步代码 它实际上不会完成 直到您恢复执行为止 这是一个问题 调试器允许您快速试验多个 api 方法 但如果您恢复它 您就不能 debugger now type the follo
  • 如何更改传单中功能集的样式?

    我正在看等值区域的例子 https leafletjs com examples choropleth https leafletjs com examples choropleth 这是他们使用的数据源 type Feature prop
  • 访问sendBeacon发送的数据

    文档表明sendBeacon通过发送其数据HTTP POST request 但在 PHP 中 POST变量似乎是一个空数组 这是我的 JavaScript 代码 navigator sendBeacon beacon log php My
  • 动态速度计 javascript 或 jquery 插件

    我希望有动态ajax插件在页面上显示速度计 一个想法是我设置一个背景并旋转针 有人知道相关插件吗 这里有一些供您参考 http bernii github com gauge js http bernii github com gauge
  • 如何在ASP.NET Webform中使用Jquery表单插件?

    我遇到了这个插件 http malsup com jquery form getting started http malsup com jquery form getting started 我想知道如何在 ASP NET WebForm
  • 如何使用 JavaScript 中的值填充下拉列表?

    我在 Tridion CMS 扩展中的功能区工具栏按钮中添加了一个按钮 单击该按钮后 将显示一个弹出页面 其中包含两个下拉菜单 通过更改第一个下拉控件中的值 我应该填充第二个下拉控件的值 就我而言 我正在使用ASP drop down li
  • jquery 验证错误位置

    这看起来很简单 但我无法弄清楚 我正在使用 jquery 验证插件 我验证所有文件 但我想要的是在输入文本行中显示验证消息警报 例如在电子邮件输入中 请填写电子邮件地址 但现在它出现在所有字段下 在我的html中
  • 使用 moment.js 检查输入日期是否为星期一

    好吧 我想检查日期是否是星期一 例如 var myDate new Date moment myDate DD MM YYYY dayIs monday 在我的国家 一周的第一天是星期一 所以 我真的想检查输入日期是否是一周的开始 我尝试使
  • 如何按照编写的顺序迭代 javascript 对象属性

    我发现了代码中的一个错误 我希望通过最少的重构工作来解决该错误 此错误发生在 Chrome 和 Opera 浏览器中 问题 var obj 23 AA 12 BB iterating through obj s properties for
  • 如何仅在 NextJS 站点构建期间使用 getInitialProps?

    当使用 NextJS 构建静态站点时 我想要getInitialProps方法仅在构建步骤期间触发 而不是在客户端上触发 在构建步骤中 NextJS 运行getInitialProps 方法 https nextjs org docs fe
  • 如何使用 jest 模拟第三方库

    我正在开发一个node js应用程序使用nestjs我有一堂课叫LoggerService如下 export class LoggerService private logger Rollbar constructor this logge
  • Node.js - console.log 不显示数组中的项目,而是显示 [Object]

    我在注销对象内数组的内容时遇到问题 实际的物体看起来像这样 var stuff accepted item1 item2 rejected response Foo envelope from The sender to new item1
  • Typeahead.js substringMatcher 函数说明

    我只是在做一些研究Typeahead js这是一个非常酷的图书馆 感谢文档 我已经成功地获得了一个基本的示例 该文档也非常好 但是我试图弄清楚以下代码块实际上在做什么 var substringMatcher function strs r
  • Chartjs刻度标签位置

    尝试让 Y 轴刻度标签看起来像image https i stack imgur com XgoxX png 位于秤顶部且不旋转 缩放选项当前如下所示 scales yAxes id temp scaleLabel display true
  • 无法在前端使用 JavaScript Fetch API 将文件上传到 FastAPI 后端

    我正在尝试弄清楚如何将图像发送到我的 API 并验证生成的token那是在header的请求 到目前为止 这就是我所处的位置 app post endreProfilbilde async def endreProfilbilde requ
  • 如何在 javascript 正则表达式中匹配平衡分隔符?

    我原以为这个问题是不可能的 据我所知 Javascript 的正则表达式既没有递归插值 也没有漂亮的 NET 平衡组功能 但问题就在那里 如问题 12 所示正则表达式 alf nu http regex alf nu 匹配平衡对 lt an
  • 在 Javascript 中减少/分组数组

    基于this https stackoverflow com a 40774906 3254598例如 我想以稍微不同的方式按对象进行分组 结果应该如下 key audi items make audi model r8 year 2012
  • 在 GWT 中,在任何主机页标记上添加事件处理程序

    我想为任何标签添加 MouseOver 事件处理程序 举个例子 我想为旧版 HTML 页面中的每个锚点页面添加事件处理程序 继GWT指南 http code google com webtoolkit doc 1 6 DevGuideUse

随机推荐