如何使圆弧角出去,而不是在一个Three.js形状
How to make the arc corners go out not in with a Three.js Shape
如何使所有的三个角(使用Shape .absarc创建)的three .js形状走出去,而不是在?
见http://jsfiddle.net/theo/v7v4fu2v/
// Shape
var radius = 10;
var material = new THREE.MeshNormalMaterial();
pt1 = new THREE.Vector3(40, 50, 0);
pt2 = new THREE.Vector3(-40, 0, 0);
pt3 = new THREE.Vector3(30, -20, 0);
p = pt3.clone().sub(pt1);
a1 = Math.atan2(p.y, p.x) + Math.PI / 2;
p = pt2.clone().sub(pt1);
a2 = Math.atan2(p.y, p.x) - Math.PI / 2;
p = pt1.clone().sub(pt2);
a3 = Math.atan2(p.y, p.x) + Math.PI / 2;
p = pt3.clone().sub(pt2);
a4 = Math.atan2(p.y, p.x) - Math.PI / 2;
shape = new THREE.Shape();
shape.absarc(pt1.x, pt1.y, radius, a1, a2, true);
shape.absarc(pt2.x, pt2.y, radius, a3, a4, true);
shape.absarc(pt3.x, pt3.y, radius, a4, a1, true);
var geometry = shape.extrude({
amount: 10,
bevelEnabled: false
});
mesh = new THREE.Mesh(geometry, material);
mesh.position.z = 0;
scene.add(mesh);
一个角"出去",但两个角"进去"。你是怎么把这些角都凸出来的?
这是一种从路径创建挤压形状的方法。
var path = new THREE.Path();
path.absarc( pt1.x, pt1.y, radius, a1, a2, false );
path.absarc( pt2.x, pt2.y, radius, a3, a4, false );
path.absarc( pt3.x, pt3.y, radius, a4, a1, false );
var points = path.getSpacedPoints( 100 );
var shape = new THREE.Shape( points );
var geometry = new THREE.ExtrudeGeometry( shape, {
amount: 10,
bevelEnabled: false
} );
var mesh = new THREE.Mesh( geometry, new THREE.MeshNormalMaterial() );
scene.add( mesh );
http://jsfiddle.net/v7v4fu2v/35/three.js r.87
相关文章:
- D3在一个调用中绘制不同的SVG形状,没有可见性
- 为什么画布形状只在3个画布中的最后一个画布上渲染
- 制作一个渲染器's的背景是透明的,但不是形状three.js
- 在Canvas Paint Program中添加一个向下菜单以更改笔刷的形状
- 从带有循环的数组中一个接一个地在画布上绘制形状
- 如何在d3.js中将一个形状转换为另一个形状
- HTML5画布:如何在画布上有一个图像和形状,并且可以拖放形状
- 在鼠标移动时绘制一个矩形,并使用 kineticjs 在鼠标向上选择该矩形内的所有形状
- 将谷歌地图绘图库限制为一个折线/形状
- 如何制作动能.像其他动能形状一样,线发射一个事件
- 在HTML5画布上绘制一个X形状,并检查与边框的冲突
- 通过拖放DOM元素在d3.js中创建一个形状
- WebGL-呈现一个又一个形状时出现问题
- 在画布中重复绘制一个形状
- kineticjs当一个形状与另一个形状重叠时停止拖动
- 如何在fabricjs中选择另一个形状边界内的形状
- 我需要为我的网页制作一个形状
- KineticJS,我能重画一个形状吗?(在画布上画画)
- 三个.js粒子形成一个形状
- 如何扫描pdf中特定的颜色,然后在它周围创建一个形状