【recast-navigation-js】使用three.js辅助绘制Agent寻路路径

news2024/11/15 7:09:25

目录

  • 说在前面
  • setAgentTarget
  • 绘制寻路路径
  • 结果
  • 问题
  • 其他

说在前面

  • 操作系统:windows 11
  • 浏览器:edge版本 124.0.2478.97
  • recast-navigation-js版本:0.29.0
  • golang版本:1.21.5
  • 上一篇:【recast-navigation-js】使用three.js辅助绘制Agent

setAgentTarget

  • 使用recast navigation接口requestMoveTarget设置agent的目标位置
    public setAgentTarget(pos: Vector3) {
    
        const { point: target } = this._meshQuery.findClosestPoint(pos);
        this._agent.requestMoveTarget(target);
    
        this._agentTarget = new Vector3().copy(target as Vector3)
    }
    

绘制寻路路径

  • 使用three.js中的Line绘制寻路路径
    private _updatePath(scene: Scene) {
        if (!this._agentTarget) {
            return
        }
        const path = []//[this._agent.position(), ...this._agent.corners()];
        path.push(new Vector3().set(this._agent.position().x, this._agent.position().y, this._agent.position().z))
        this._agent.corners().forEach((v) => {
            path.push(new Vector3().set(v.x, v.y, v.z))
        })
    
        if (path.length <= 1) {
            return
        }
    
        const spline = new CatmullRomCurve3(path);
    
        const samples = spline.getPoints(path.length * 12);
        const geometrySpline = new BufferGeometry().setFromPoints(samples);
    
        const line = new Line(geometrySpline, new LineDashedMaterial({ color: 0x66ccff, dashSize: 1, gapSize: 0.5 }));
        line.computeLineDistances();
    
        if (this.crowdPathLine) {
            scene.remove(this.crowdPathLine)
        }
        this.crowdPathLine = line
        scene.add(line)
    }
    
  • CatmullRomCurve3
    给定输入点,创建相对平滑的曲线(实际上可以不用这个,使用实际的寻路关键点更能反映寻路结果)
  • LineDashedMaterial
    虚线材质
  • update,每帧重新绘制寻路路径
    public update(delta: number, scene: Scene) {
        this._crowd.update(delta)
        this.crowdHelper.update()
        this._updatePath(scene)
    }
    

结果

  • 鼠标右键设置agent起始位置
  • 鼠标左键设置agent目标位置
    在这里插入图片描述

问题

  • 最开始使用Teleport方法设置agent起点的时候,发现有些地方不太对,比如点击下图红色位置传送不过去
    在这里插入图片描述
    寻路也不对
    在这里插入图片描述
  • 后来发现是创建DebugDrawer的时候自己把它的位置做了下偏移
    const tmpDebugDrawer = new DebugDrawer();
        tmpDebugDrawer.drawNavMesh(mesh);
        tmpDebugDrawer.position.z += 10
    
  • 导致实际点击得到的位置也有一定的偏移,所以在传给recastnavigation使用的时候需要将这个偏移去掉,或者在创建的时候不要加偏移

其他

  • 完整代码再等等

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1808325.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

STM32CubeIDE使用过程记录

最近在做一款机器人的开发&#xff0c;使用到了STM32CubeIDE&#xff0c;这里记录一些使用技巧方便后续查阅。 STM32CubeIDE使用过程记录 快捷键开启代码自动补全功能看门狗设置CRC设置IO口取反定时器设置 及 定时器中断外部中断GPIO配置STC15单片机GPIO模式配置片内闪存&#…

PyTorch学习7:加载数据集

文章目录 前言一、epoch&#xff0c;batch-size和iteration二、示例1.说明2.代码示例 总结 前言 介绍PyTorch中加载数据集的相关操作。Dataset和DataLoader 一、epoch&#xff0c;batch-size和iteration epoch&#xff1a;所有训练数据完成一次前馈和反馈 batch-size&#x…

深度学习革命-AI发展详解

深度学习革命 《深度学习革命》是一部引人深思的作品&#xff0c;详细讲述了深度学习技术的发展历程及其对各个行业的深远影响。由杰出的计算机科学家、深度学习专家撰写&#xff0c;这本书不仅适合科技领域的专业人士阅读&#xff0c;也为普通读者提供了一个理解人工智能革命…

Vue TypeScript 实战:掌握静态类型编程

title: Vue TypeScript 实战&#xff1a;掌握静态类型编程 date: 2024/6/10 updated: 2024/6/10 excerpt: 这篇文章介绍了如何在TypeScript环境下为Vue.js应用搭建项目结构&#xff0c;包括初始化配置、创建Vue组件、实现状态管理利用Vuex、配置路由以及性能优化的方法&#x…

【电机控制】FOC算法验证步骤——电流环PI参数、速度环PI参数

【电机控制】FOC算法验证步骤——电流环PI参数、速度环PI参数 文章目录 前言一、电流环PI1.TI手册 二、速度环PI1.TI手册——根据稳定性和带宽计算速度环PI参数2.TI手册——根据稳定性和带宽计算速度环PI参数 三、参考文献总结 前言 【电机控制】直流有刷电机、无刷电机汇总—…

Python私教张大鹏 Vue3整合Vue Router之编程式导航

除了使用 <router-link> 创建 a 标签来定义导航链接&#xff0c;我们还可以借助 router 的实例方法&#xff0c;通过编写代码来实现。 导航到不同的位置 注意: 下面的示例中的 router 指代路由器实例。在组件内部&#xff0c;你可以使用 $router 属性访问路由&#xff…

vue-cli是什么?和 webpack是什么关系?

前言 Vue CLI是Vue.js项目的官方脚手架&#xff0c;基于Node.js与Webpack构建。安装Vue CLI前需确保Node.js已安装&#xff0c;随后通过npm全局安装。Vue CLI能迅速创建和管理Vue.js项目&#xff0c;提升开发效率。而Webpack则负责资源打包&#xff0c;通过配置文件管理依赖、插…

FiRa标准UWB MAC实现(三)——距离如何获得?

继续前期FiRa MAC相关介绍,将FiRa UWB MAC层相关细节进一步进行剖析,介绍了UWB技术中最重要的一个点,高精度的距离是怎么获得的,具体使用的测距方法都有哪些,原理又是什么。为后续FiRa UWB MAC的实现进行铺垫。 3、测距方法 3.1 SS-TWR SS-TWR为Single-Sided Two-Way Ra…

通过python操作redis(windows)

注意在连接之前要确保 redis 服务已经安装。 更多的安装信息请查看&#xff1a;https://blog.csdn.net/sinat_20471177/article/details/132042779?spm1001.2014.3001.5501 redis 模块 Python 要使用 redis&#xff0c;需要先安装 redis 模块。如果要做数据导入/导出操作的…

动手学深度学习4.10 实战Kaggle比赛:预测房价-笔记练习(PyTorch)

以下内容为结合李沐老师的课程和教材补充的学习笔记&#xff0c;以及对课后练习的一些思考&#xff0c;自留回顾&#xff0c;也供同学之人交流参考。 本节课程地址&#xff1a;实战 Kaggle 比赛&#xff1a;预测房价_哔哩哔哩_bilibili 本节教材地址&#xff1a;4.10. 实战Ka…

公式转换坑

在线LaTeX公式编辑器-编辑器 (latexlive.com) 这个好用 latex输入后转mathtype等 1 \mathcal{V}\{0,1,\ldots,|\mathcal{V}|-1\} 这个玩意在Word死活打不出来 使用下面的方法也不行 mathtype也不行 故换符号之 LaTeX公式与MathType公式如何快速转换-MathType中文网 如何在…

.Net实现SCrypt Hash加密

方案1 &#xff08;加密后存储“算法设置”、“盐(随机值)”、“Hash值”&#xff0c;以“$”分隔&#xff09;&#xff1a; //Nuget引入SCrypt.NET库 using Org.BouncyCastle.Crypto.Generators; using Scrypt; using System; using System.Security.Cryptography; namespace …

Python基础教程(九):装饰器

&#x1f49d;&#x1f49d;&#x1f49d;首先&#xff0c;欢迎各位来到我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里不仅可以有所收获&#xff0c;同时也能感受到一份轻松欢乐的氛围&#xff0c;祝你生活愉快&#xff01; &#x1f49d;&#x1f49…

强大的.NET的word模版引擎NVeloDocx

在Javer的世界里&#xff0c;存在了一些看起来还不错的模版引擎&#xff0c;比如poi-tl看起来就很不错&#xff0c;但是那是人家Javer们专属的&#xff0c;与我们.Neter关系不大。.NET的世界里Word模版引擎完全是一个空白。 很多人不得不采用使用Word XML结合其他的模版引擎来…

怎样快速获取Vmware VCP 证书,线上考试,voucher报名优惠

之前考一个VCP证书&#xff0c;要花大一万的费用&#xff0c;可贵了&#xff0c;考试费不贵&#xff0c;贵就贵在培训费&#xff0c;要拿到证书&#xff0c;必须交培训费&#xff0c;即使vmware你玩的很溜&#xff0c;不需要再培训了&#xff0c;但是一笔贵到肉疼的培训费你得拿…

嵌入式Linux系统编程 — 3.4 access、chmod和 umask函数修改文件访问权限

目录 1 文件访问权限 1.1 文件权限基本概念 1.2 普通权限 1.3 特殊权限 2 目录权限 3 access函数检查文件权限 3.1 access函数简介 3.2 示例程序 3.3 chmod修改文件权限 3.4 fchmod函数 4 umask 函数 4.1 umask简介 4.2 示例程序 1 文件访问权限 1.1 文件权限基本…

奇安信停服,国内还有什么可用的高防么?

这里写自定义目录标题 背景DDOS怎么办&#xff1f;方案推荐总结 背景 继前段时间百度云加速通知免费服务&#xff0c;6月底奇安信也将停止服务&#xff0c;到时候国内将几乎不存在免费好用的高防CDN了&#xff1b;类似的事情还有阿里云和腾讯云的一年期免费SSl证书也都停止供应…

2024 AEE | 风丘科技将亮相日本爱知国际会展中心——共同创造!

2024年名古屋汽车工程博览会&#xff08;Automotive Engineering Exposition 2024 NAGOYA&#xff09;将于7月17-19日在日本爱知县国际展示场&#xff08;Aichi Sky Expo&#xff09;开展。本展会是专门为活跃在汽车行业的工程师和研究人员举办的汽车技术展览&#xff0c;汇聚了…

vmware-17虚拟机安装教程,安装linux centos系统

下载VMware 1.进入VMware官网&#xff1a;https://www.vmware.com/sg/products/workstation-pro.html 2.向下翻找到&#xff0c;如下界面并点击“现在安装” 因官网更新页面出现误差&#xff0c;现提供vmware17安装包网盘链接如下&#xff1a; 链接&#xff1a;https://pan.b…

细说NLP中的Embedding层

文章目录 前言一、为什么要引入Embedding层二、Embedding层是怎么发挥作用的&#xff1f;三、感受Embedding的强大四、为什么理解Embedding的底层原理&#xff1f;总结 前言 在构建高效的自然语言处理模型时&#xff0c;Embedding层是不可或缺的组成部分。它不仅可以帮助我们捕…