查了一些文章,准备自己用typescript写一个简单的八叉树场景管理。

所谓的简单,就是所有元素都是边长为1的立方体。

元素类和树节点类

//元素类,因为都是边长为1的立方体,所以就用cube命名
export class CubeData {public readonly position: Vec3 = new Vec3();
}export class OcTreeNode {constructor(centerPosition: Vec3) {this.centerPosition.set(centerPosition);}centerPosition: Vec3 = new Vec3();//中心坐标children: OcTreeNode[] = [];//包含的子节点items: CubeData[] = [];//包含的元素数组sideLength = 0;//边长level = 0;//节点深度
}

其中Vec3为三维向量类,这里主要用来存储坐标。

判断元素是否和节点相交

需要x,y,z三个轴向的中心距离小于半边长之和。

即:

const isXIn = Math.abs(item.position.x - ocTree.centerPosition.x) < intersectDistance;
const isYIn = Math.abs(item.position.y - ocTree.centerPosition.y) < intersectDistance;
const isZIn = Math.abs(item.position.z - ocTree.centerPosition.z) < intersectDistance;
if (isXIn && isYIn && isZIn) {
//相交,则推入元素数组ocTree.items.push(item);
}

八叉树划分

进行围绕该节点的八个方向进行划分,划分的节点坐标基数是:

    [[1, 1, 1],[1, 1, -1],[1, -1, 1],[1, -1, -1],[-1, 1, 1],[-1, 1, -1],[-1, -1, 1],[-1, -1, -1]]

这些数据是基数,划分的节点的坐标应该是基数*变成的四分之一然后加上该节点的中心坐标。

然后,对包含元素大于1个的节点进行划分,直至最后划分到边长为1的节点。

    if (ocTree.items.length > 1 && ocTree.sideLength > 1) {for (let i = 0; i < APPConfig.ocTreeChildrenOffsetArray.length; i++) {const [x, y, z] = APPConfig.ocTreeChildrenOffsetArray[i];this.toolVec.set(x, y, z).multiplyScalar(ocTree.sideLength / 4).add(ocTree.centerPosition);const childOcTree = new OcTreeNode(this.toolVec);childOcTree.level = ocTree.level + 1;childOcTree.sideLength = ocTree.sideLength / 2;ocTree.children.push(childOcTree);this.initOcTree(childOcTree, ocTree.items);}}

为了避免在边长为1的节点里出现两个位置一样的元素,然后进行无意义划分,需要限制一下,不能对边长为1的节点进行划分。

节点坐标和边长注意

我期望的是边长为1的节点正好可以完整包围一个元素,然后每个元素的坐标希望是整数。所以根节点的坐标需要是(0.5,0.5,0.5),边长是2的幂次方。这样进行n次划分后,边长为1的节点的坐标就是整数了。

比如根节点的坐标是:(a.5,,),边长是2^n 。那么第一次划分,边长为2^(n-1)的(1,1,1)节点坐标是:(a.5+2^(n-2),,) 。再进行划分,边长为1的一个节点的坐标就是:

(a.5+2^(n-2)+2^(n-1-2)+...+2^(2-2)+2^(1-2),,)=(a.5+2^(n-1)-0.5,,)= (a+2^(n-1),,)

正好是整数。

接下来就是更新和射线检测,等研究完了再回来更新。:)

typescript 八叉树的简单实现相关推荐

  1. c# typescript_在任何IDE中从C#,Java或Python代码获取TypeScript接口的简单方法

    c# typescript by Leonardo Carreiro 莱昂纳多·卡雷罗(Leonardo Carreiro) 在任何IDE中从C#,Java或Python代码获取TypeScript接 ...

  2. 八叉树 java_java简单实现八叉树图像处理代码示例

    一晃工作有段时间了,第一次写博客,有点不知道怎么写,大家将就着看吧,说的有什么不正确的也请大家指正. 最近工作中用到了一个图像压缩的功能.找了一些工具,没有太好的选择.最后选了一个叫jdeli的,奈何 ...

  3. vue服务器渲染/nuxt/vant-ui/mint-ui/typeScript/stylus(简单了解带网址)

    什么是服务器端渲染 (SSR)? Vue.js 是构建客户端应用程序的框架.默认情况下,可以在浏览器中输出 Vue 组件,进行生成 DOM 和操作 DOM.然而,也可以将同一个组件渲染为服务器端的 H ...

  4. TypeScript 函数以及简单使用和操作

    TypeScript 函数 一.常规函数定义和函数调用方式 二.带参数函数定义和调用方式 三.匿名函数定义和调用方式 四.构造函数定义和调用方式 五.递归函数定义和调用方式 六.箭头函数定义和调用方式 ...

  5. typescript+reac实现简单的拖拽(移动端+PC端)

    一.移动端 1.tsx代码 import React, { Component, createRef } from "react"; import './Drag.less' in ...

  6. 八叉树的范围和射线检测

    接typescript八叉树的简单实现 说一下typescript八叉树的范围和射线检测实现. 学习八叉树,并用自己的方式实现一下,理论联系实际 范围检测 应用场景 在3d项目中,针对场景节点较多的情 ...

  7. 数据结构(1):简单八叉树学习--SimpleOctree

    该代码定义了八叉树的数据结构,并在main.cpp中演示了"查询某一空间范围框内有哪些八叉树节点"这个demo 目录 1 文件目录: 2 Vec3.h 3 OctreePoint. ...

  8. AngularJS2.0 quick start——其和typescript结合需要额外依赖

    AngularJS2 发布于2016年9月份,它是基于ES6来开发的. 运行条件! 由于目前各种环境(浏览器或 Node)暂不支持ES6的代码,所以需要一些shim和polyfill(IE需要)让ES ...

  9. typescript 入门例子 Hello world——ts就是一个宿主机语言

    安装 TypeScript TypeScript 的命令行工具安装方法如下: npm install -g typescript 安装完成之后,就有了 tsc 命令.编译一个 TypeScript 文 ...

最新文章

  1. PL/SQL中查询Oracle大数(17位以上)时显示科学计数法的解决方法
  2. freeimage ubuntu安装
  3. 电信充q币短信怎么发_王者荣耀充值中心Q币充值IOS系统游戏点券的办法_云奇付Q币寄售...
  4. oracle怎么解析sql,oracle SQL解析步骤小结
  5. windows10 系统设置一键备份
  6. 针对行业需求服务优质客户 ,网易云信助金融行业“网上冲浪”
  7. 前端学习(693):for循环案例之求出偶数奇数之和
  8. LAMP或LNMP一键安装包
  9. 快速上手Linux核心命令(三):文件和目录操作命令
  10. DenseNet论文笔记
  11. php 动态参数,PHP 动态配置运行时环境参数ini_xxx,extension_loaded
  12. python安装rarfile模块_python模块整理7-zipfile模块
  13. c#windfrom打包_WinForm程序打包教程
  14. 自动化的人肉搜索引擎即将出现?
  15. 记自己在用友的三个月实习经历
  16. echaer 地图_Echarts实现中国地图、省份地图及对应数据展示
  17. 大学学习历程简单总结
  18. 国内最受欢迎的API市场对比和介绍
  19. HIT CS科班对计算机专业素养的理解
  20. matlab海图栅格化_matlab栅格化图片代码

热门文章

  1. regsvr32 命令使用和regsvr32 dll失败原因介绍
  2. 云原生 + 无代码,「DaoCloud 道客」探索无限可能——「DaoCloud 道客」+轻流联合解决方案
  3. Docker 使用国内镜像daocloud.io
  4. TypeScript 初学者入门学习笔记(一)
  5. plsql检测不到oracle,64位ORACLE客户端上plsql无法识别ORACLE_HOME解决方案
  6. 第08讲:既生 Synchronized,何生 ReentrantLock
  7. 2015 mbpr13 升级固态硬盘
  8. 你的论文题目确定了吗
  9. Spring Cloud Eureka服务治理
  10. 【SQL实战经验一】:SQL语句中存在英文的单引号、双引号问题