版本
0.123.0，使用0.143版本时会报computeFlatVertexNormals方法不存在
效果
演示地址
延伸
项目代码
var scene = new THREE.Scene()
var geometry = new THREE.ConeGeometry(25, 100, 4)
// 缓冲类型几何体BufferGeometry没有computeFlatVertexNormals方法
geometry.computeFlatVertexNormals()//一种计算顶点法线方式，非光滑渲染
// 可以根据需要旋转到特定角度
geometry.rotateX(Math.PI)
var material = new THREE.MeshLambertMaterial({
color: 0x00ffff,
})
var mesh = new THREE.Mesh(geometry, material)
scene.add(mesh)
/**
* 光源设置
*/
// 平行光1
var directionalLight = new THREE.DirectionalLight(0xffffff, 0.6)
directionalLight.position.set(400, 200, 300)
scene.add(directionalLight)
// 平行光2
var directionalLight2 = new THREE.DirectionalLight(0xffffff, 0.6)
directionalLight2.position.set(-400, -200, -300)
scene.add(directionalLight2)
//环境光
var ambient = new THREE.AmbientLight(0xffffff, 0.4)
scene.add(ambient)
// var gridHelper = new THREE.GridHelper(300, 25, 0x004444, 0x004444);
// gridHelper.position.y = -0.5;
// scene.add(gridHelper);
var axesHelper = new THREE.AxesHelper(300)
scene.add(axesHelper)
// axesHelper.position.y = -0.2;
/**
* 相机设置
*/
var width = window.innerWidth //窗口宽度
var height = window.innerHeight //窗口高度
var k = width / height //窗口宽高比
var s = 150 //三维场景显示范围控制系数，系数越大，显示的范围越大
//创建相机对象
var camera = new THREE.OrthographicCamera(-s * k, s * k, s, -s, 1, 1000)
camera.position.set(200, 300, 200) //设置相机位置
// camera.position.set(0, 0, 200); //设置相机位置
camera.lookAt(scene.position) //设置相机方向(指向的场景对象)
/**
* 创建渲染器对象
*/
var renderer = new THREE.WebGLRenderer({
antialias: true, //开启锯齿
})
renderer.setSize(width, height) //设置渲染区域尺寸
// 渲染函数
function render () {
mesh.rotateY(0.01)
renderer.render(scene, camera) //执行渲染操作
requestAnimationFrame(render) //请求再次执行渲染函数render，渲染下一帧
}
render()
//创建控件对象 相机对象camera作为参数 控件可以监听鼠标的变化，改变相机对象的属性
var controls = new OrbitControls(camera, renderer.domElement)
that.$refs.canvasGLTF.appendChild(renderer.domElement)
