three.js 源码注释(八十二)extras/geometries/RingGeometry.js

本文详细注释了THREE.js库中extras/geometries/RingGeometry.js文件的内容,适用于web3d开发人员,特别是关注数据可视化和WebGL的开发者。作者强调了学习过程中的不足,并提供了源码的GitHub仓库链接供进一步研究。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

商域无疆 (http://blog.youkuaiyun.com/omni360/)

本文遵循“署名-非商业用途-保持一致”创作公用协议

转载请保留此句:商域无疆 -  本博客专注于 敏捷开发及移动和物联设备研究:数据可视化、GOLANG、Html5、WEBGL、THREE.JS否则,出自本博客的文章拒绝转载或再转载,谢谢合作。


俺也是刚开始学,好多地儿肯定不对还请见谅.

以下代码是THREE.JS 源码文件中extras/geometries/RingGeometry.js文件的注释.

更多更新在 : https://github.com/omni360/three.js.sourcecode


/**
 * @author Kaleb Murphy
 */
/*
///RingGeometry用来在三维空间内创建一个二维圆环面对象.
///
///	用法: var geometry = new THREE.RingGeometry(1,5,32);	
/// 	  var material = new THREE.MeshBasicMaterial({color: 0x00ff00});
/// 	  var Ring = new THREE.Mesh(geometry,material);
/// 	  scene.add(Ring);
*/
///<summary>TorusGeometry</summary>
///<param name ="innerRadius" type="float">圆环面内圆半径,默认初始化为0</param>
///<param name ="outerRadius" type="float">圆环面外圆半径,默认初始化为50</param>
///<param name ="thetaSegments" type="int">圆环面圆周上的细分线段数,代表了圆环的圆度,最低的是3。默认值是8</param>
///<param name ="phiSegments" type="int">圆环面内圆到外圆方向上的细分线段数,最低的是1。默认值是8</param>
///<param name ="thetaStart" type="float">圆环面的起始角度,默认初始化为0</param>
///<param name ="thetaLength" type="float">圆环面圆周弧长,默认初始化为Math.PI * 2</param>
THREE.RingGeometry = function ( innerRadius, outerRadius, thetaSegments, phiSegments, thetaStart, thetaLength ) {

	THREE.Geometry.call( this );	//调用Geometry对象的call方法,将原本属于Geometry的方法交给当前对象RingGeometry来使用.

	innerRadius = innerRadius || 0;	//圆环面内圆半径,默认初始化为0
	outerRadius = outerRadius || 50;	//圆环面外圆半径,默认初始化为50

	thetaStart = thetaStart !== undefined ? thetaStart : 0;	//圆环面的起始角度,默认初始化为0
	thetaLength = thetaLength !== undefined ? thetaLength : Math.PI * 2;	//圆环面圆周弧长,默认初始化为Math.PI * 2

	thetaSegments = thetaSegments !== undefined ? Math.max( 3, thetaSegments ) : 8;	//圆环面圆周上的细分线段数,代表了圆环的圆度,最低的是3。默认值是8
	phiSegments = phiSegments !== undefined ? Math.max( 1, phiSegments ) : 8;	//圆环面内圆到外圆方向上的细分线段数,最低的是1。默认值是8

	var i, o, uvs = [], radius = innerRadius, radiusStep = ( ( outerRadius - innerRadius ) / phiSegments );
	//计算顶点数据,压入vertices数组.
	for ( i = 0; i < phiSegments + 1; i ++ ) { // concentric circles inside ring

		for ( o = 0; o < thetaSegments + 1; o ++ ) { // number of segments per circle 圆周上的分段数

			var vertex = new THREE.Vector3();
			var segment = thetaStart + o / thetaSegments * thetaLength;
			vertex.x = radius * Math.cos( segment );
			vertex.y = radius * Math.sin( segment );

			this.vertices.push( vertex );
			uvs.push( new THREE.Vector2( ( vertex.x / outerRadius + 1 ) / 2, ( vertex.y / outerRadius + 1 ) / 2 ) );
		}

		radius += radiusStep;

	}

	var n = new THREE.Vector3( 0, 0, 1 );
	//计算三角面,以及贴图uv.
	for ( i = 0; i < phiSegments; i ++ ) { // concentric circles inside ring

		var thetaSegment = i * (thetaSegments + 1);

		for ( o = 0; o < thetaSegments ; o ++ ) { // number of segments per circle 圆周上的分段数

			var segment = o + thetaSegment;

			var v1 = segment;
			var v2 = segment + thetaSegments + 1;
			var v3 = segment + thetaSegments + 2;

			this.faces.push( new THREE.Face3( v1, v2, v3, [ n.clone(), n.clone(), n.clone() ] ) );
			this.faceVertexUvs[ 0 ].push( [ uvs[ v1 ].clone(), uvs[ v2 ].clone(), uvs[ v3 ].clone() ]);

			v1 = segment;
			v2 = segment + thetaSegments + 2;
			v3 = segment + 1;

			this.faces.push( new THREE.Face3( v1, v2, v3, [ n.clone(), n.clone(), n.clone() ] ) );
			this.faceVertexUvs[ 0 ].push( [ uvs[ v1 ].clone(), uvs[ v2 ].clone(), uvs[ v3 ].clone() ]);

		}
	}

	this.computeFaceNormals();	//计算面的法线

	this.boundingSphere = new THREE.Sphere( new THREE.Vector3(), radius );	//计算球体边界

};
/*************************************************
****下面是RingGeometry对象的方法属性定义,继承自Geometry对象.
**************************************************/
THREE.RingGeometry.prototype = Object.create( THREE.Geometry.prototype );


商域无疆 (http://blog.youkuaiyun.com/omni360/)

本文遵循“署名-非商业用途-保持一致”创作公用协议

转载请保留此句:商域无疆 -  本博客专注于 敏捷开发及移动和物联设备研究:数据可视化、GOLANG、Html5、WEBGL、THREE.JS否则,出自本博客的文章拒绝转载或再转载,谢谢合作。


以下代码是THREE.JS 源码文件中extras/geometries/RingGeometry.js文件的注释.

更多更新在 : https://github.com/omni360/three.js.sourcecode

<think>我们注意到在配置文件中,baseurl已经指向了阿里云镜像,但是URL中使用了变量$basearch,这通常是正确的。然而,之前用户遇到了DNS解析问题,现在需要确保网络连接和DNS解析正常,同时检查变量是否被正确替换。另外,注意到在baseurl中使用了$basearch变量,这个变量在yum执行时会被替换为系统架构(如x86_64)。但是,如果系统无法解析mirrors.aliyun.com,仍然会出现问题。因此,我们需要检查:1.网络连通性:能否访问阿里云镜像站点2.变量替换:确保$basearch等变量能够被正确替换根据之前用户遇到的错误,重点在于DNS解析,所以首先确保mirrors.aliyun.com能够被解析。建议的检查步骤:步骤1:测试域名解析步骤2:测试网络连通性步骤3:检查yum缓存和清理步骤4:手动替换变量测试(可选)具体操作:</think>### 分析 yum 仓库配置问题 从您提供的配置文件内容看,虽然已配置阿里云镜像源,但存在两个关键问题导致 yum 无法正常工作: ```ini baseurl=http://mirrors.aliyun.com/centos/7/os/$basearch/ baseurl=http://mirrors.aliyun.com/centos/7/updates/$basearch/ ... ``` #### 主要问题: 1. **变量未正确替换**: `$basearch` 和 `$releasever` 是 yum 变量,但当前配置中未启用变量解析功能 2. **协议限制**: 使用 HTTP 协议可能被防火墙拦截,应升级为 HTTPS 3. **仓库定义错误**: 缺少必要的仓库标识和 GPG 校验配置 --- ### 完整修复方案 #### 1. 修正仓库配置文件 ```bash # 备份原文件 sudo cp /etc/yum.repos.d/CentOS-Base.repo /etc/yum.repos.d/CentOS-Base.repo.bak # 使用标准阿里云镜像配置 sudo curl -o /etc/yum.repos.d/CentOS-Base.repo \ https://mirrors.aliyun.com/repo/Centos-7.repo ``` #### 2. 手动修正变量(可选) ```bash # 若需自定义,替换所有 $basearch 和 $releasever sudo sed -i \ -e 's/\$basearch/x86_64/g' \ -e 's/\$releasever/7/g' \ -e 's|^#baseurl|baseurl|g' \ -e 's|^mirrorlist|#mirrorlist|g' \ /etc/yum.repos.d/CentOS-Base.repo ``` #### 3. 更新缓存 ```bash # 清除旧缓存 sudo yum clean all # 创建新缓存 sudo yum makecache ``` #### 4. 验证配置 ```bash # 检查生效的仓库 yum repolist # 测试安装 sudo yum install -y telnet ``` --- ### 配置优化建议 #### 推荐仓库配置示例 ```ini [base] name=CentOS-$releasever - Base baseurl=https://mirrors.aliyun.com/centos/7/os/x86_64/ gpgcheck=1 gpgkey=https://mirrors.aliyun.com/centos/RPM-GPG-KEY-CentOS-7 [updates] name=CentOS-$releasever - Updates baseurl=https://mirrors.aliyun.com/centos/7/updates/x86_64/ gpgcheck=1 ``` #### 关键参数说明: | 参数 | 作用 | 推荐值 | |------|------|--------| | `gpgcheck` | 包签名验证 | `1` (必须启用) | | `enabled` | 仓库开关 | `1` (默认启用) | | `sslverify` | HTTPS证书验证 | `0` (内网环境可关闭) | > **注意**:生产环境应保持 `gpgcheck=1` 确保软件包完整性
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值