diff --git a/data/posts/object-around-in-threejs.mdx b/data/posts/object-around-in-threejs.mdx index 2446b49..91e92f7 100644 --- a/data/posts/object-around-in-threejs.mdx +++ b/data/posts/object-around-in-threejs.mdx @@ -4,6 +4,12 @@ date: '2022-09-02' tags: [Three.js, React] --- + + 使一个物体围绕另一个物体运动,主要是保证围绕物体的运动轨迹。在 three.js 中,一个 Mesh 实例可以通过其自身的 `add()` 方法,去添加另一个实例。 通过此方法就可以达成添加一个实例成为另一个实例的子节点。当父节点进行运动时(例如自身旋转),子节点也会跟随运动。 @@ -22,7 +28,7 @@ const target = new THREE.Object3D(); ```tsx const target = new THREE.Object3D(); - + const material = new THREE.MeshPhongMaterial({ color: '#4d4d4d', specular: '#fdfdfd', @@ -47,9 +53,9 @@ target.add(sphere); three.scene.add(target); ``` -类型推断 @@ -81,4 +87,4 @@ earth.getWorldPosition(position); ## Demo - \ No newline at end of file + diff --git a/pages/blog/[page].tsx b/pages/blog/[page].tsx index d4f1456..7b99bb1 100644 --- a/pages/blog/[page].tsx +++ b/pages/blog/[page].tsx @@ -64,7 +64,7 @@ export const getStaticProps: GetStaticProps<{ return { props: { - posts: posts.slice((page - 1) * PostPerPage, PostPerPage + 1), + posts: posts.slice((page - 1) * PostPerPage, PostPerPage * page), prev: page - 1, next: page + 1, total: Math.ceil(posts.length / PostPerPage), diff --git a/public/images/p/object-around-in-threejs/around-cover.jpg b/public/images/p/object-around-in-threejs/around-cover.jpg new file mode 100644 index 0000000..b072980 Binary files /dev/null and b/public/images/p/object-around-in-threejs/around-cover.jpg differ