码迷,mamicode.com
首页 > Web开发 > 详细

threejs 画二维圆(圆弧)

时间:2018-01-17 00:26:51      阅读:511      评论:0      收藏:0      [点我收藏+]

标签:try   point   geo   pos   rem   mat   ++   let   radius   

画圆:
var radius = 40,
segments = 64,
material = new THREE.LineBasicMaterial({ color: 0x0000ff }),
geometry = new THREE.CircleGeometry(radius, segments);

// Remove center vertex
geometry.vertices.shift();

this.scene.add(new THREE.Line(geometry, material));
 
使用THREE.Line会导致最后一点和第一点未链接,可用
this.scene.add(new THREE.LineLoop(geometry, material));
 
 
画圆也可用(该方法可自行设置画圆弧)
let points = [],
length = 100,
circle = 40;
for (let i = 0; i <= length; i++) {
  points.push(new THREE.Vector2(circle * Math.cos(Math.PI * 2 * i / length), circle * Math.sin(Math.PI * 2 * i / length)))
}
let shape = new THREE.Shape(points);
let arcGeometry = shape.makeGeometry()
let arcMaterial = new THREE.LineBasicMaterial({ color: 0x38d3f5 });
let arc = new THREE.Line(arcGeometry, arcMaterial);
this.scene.add(arc)
注:该方法画圆最后无法闭合

threejs 画二维圆(圆弧)

标签:try   point   geo   pos   rem   mat   ++   let   radius   

原文地址:https://www.cnblogs.com/brainworld/p/8297995.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!