Three.js 坐标网格 GridHelper - 文章教程

Three.js 坐标网格 GridHelper

发布于 2021-08-11 字数 1251 浏览 1122 评论 0

通过 Three.js 类 GridHelper 可以创建一个坐标网格对象,GridHelper 本质上是对线模型对象 Line 的封装,纵横交错的直线构成一个矩形网格模型对象。

// 200表示网格模型的尺寸大小,25表示纵横细分线条数量
var gridHelper = new THREE.GridHelper(200, 25);
// gridHelper和普通的网格模型、线模型一样需要插入到场景中才会被渲染显示出来
scene.add(gridHelper);

GridHelper 类创建的网格平面默认与 AxesHelper 类创建的三维坐标轴 XOZ 平面是重合的,也就是说网格平面 GridHelper 默认垂直于y轴,也就是绿色的轴线,可以进行平移、旋转等操作。

// gridHelper对象的基类是线模型Line,可以像线模型一样设置position
// 沿着y轴平移到位置-55
gridHelper.position.y = -55

构造函数 GridHelper()

  • 参数1:坐标格尺寸,默认为 10
  • 参数2:坐标格细分次数,默认为 10.
  • 参数3:中线颜色设置, 参数值是 Three.js 颜色对象 THREE.Color,THREE.Color 默认值 0x444444
  • 参数4: 坐标格网格线颜色设置, 参数值是 Three.js 颜色对象 THREE.Color,THREE.Color 默认值 0x888888

如果你对这篇文章有疑问,欢迎到本站 社区 发帖提问或使用手Q扫描下方二维码加群参与讨论,获取更多帮助。

扫码加入群聊

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

目前还没有任何评论,快来抢沙发吧!

关于作者

浮生未歇

这个人比较懒,什么都没有填写!

11 文章
5 评论
18043 人气
更多

推荐作者

瑾兮

文章 11 评论 2

carlo_sn

文章 0 评论 0

15867725375

文章 0 评论 0

a3576419

文章 0 评论 0

wendy

文章 0 评论 0