md,狗不学,我学
源码
import * as THREE from 'three'
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls'
import { GUI } from 'three/examples/jsm/libs/lil-gui.module.min.js'
import * as TWEEN from 'three/examples/jsm/libs/tween.module.js'
import { RGBELoader } from 'three/examples/jsm/loaders/RGBELoader.js'
import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader.js'
import { DRACOLoader } from 'three/examples/jsm/loaders/DRACOLoader.js'
const scence = new THREE. Scene ( ) const camera = new THREE. PerspectiveCamera ( 45 , window. innerWidth / window. innerHeight, 0.1 , 1000 )
camera. position. set ( 2 , 2 , 5 )
camera. lookAt ( 0 , 0 , 0 ) const renderer = new THREE. WebGLRenderer ( { antialias : true
} )
renderer. setSize ( window. innerWidth, window. innerHeight)
document. body. appendChild ( renderer. domElement)
const axesHelper = new THREE. AxesHelper ( 5 )
scence. add ( axesHelper) const controls = new OrbitControls ( camera, renderer. domElement)
controls. dampingFactor = 0.05
function animate ( ) { controls. update ( ) requestAnimationFrame ( animate) renderer. render ( scence, camera) TWEEN . update ( )
}
animate ( )
let rgbeLoader = new RGBELoader ( )
rgbeLoader. load ( '../public/assets/texture/Alex_Hart-Nature_Lab_Bones_2k.hdr' , envMap => { envMap. mapping = THREE . EquirectangularRefractionMappingscence. background = envMapscence. environment = envMap
} ) const geometry = new THREE. TorusKnotGeometry ( 10 , 3 , 100 , 16 )
const material = new THREE. MeshPhysicalMaterial ( { side : THREE . FrontSide
} )
const torusKnot = new THREE. Mesh ( geometry, material)
scence. add ( torusKnot)
const plane = new THREE. Plane ( new THREE. Vector3 ( 0 , - 1 , 0 ) , 0 )
material. clippingPlanes = [ plane]
renderer. localClippingEnabled = true const material_1 = new THREE. MeshBasicMaterial ( { side : THREE . BackSide, color : 0xffcccc , stencilWrite : true , stencilRef : 1 , stencilWriteMask : 0xff , stencilZPass : THREE . ReplaceStencilOp
} )
const torusKnot_1 = new THREE. Mesh ( geometry, material_1)
scence. add ( torusKnot_1)
material_1. clippingPlanes = [ plane]
let planeGeometry = new THREE. PlaneGeometry ( 40 , 40 , 1 , 1 )
let planeMaterial = new THREE. MeshPhysicalMaterial ( { color : 0xccccff , metalness : 0.95 , roughness : 0.1 , stencilWrite : true , stencilRef : 1 , stencilFunc : THREE . EqualStencilFunc
} )
let planeMesh = new THREE. Mesh ( planeGeometry, planeMaterial)
planeMesh. rotation. x = - Math. PI / 2
scence. add ( planeMesh)