这种效果如何实现呢？-灵析社区

兰豆儿

"https://codepen.io/artzub/pen/Mmgjzp" (https://codepen.io/artzub/pen/Mmgjzp) 别人的代码，是用的 d3js 画的 displacement texture，稍微改一点代码就有 渐变网格了 剩下的就是去掉 d3js 部分，用 图片代替 加载到 threejs 里 修改 87 行 const geometry = new THREE.PlaneBufferGeometry(87, 61, 16, 16) 新增 95 行 material.wireframe=true 注释 98 行 //material.normalMap = texMap https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241004/e3533b1b026e5a65e4b6c01c0d2bd7da.png *** 图上应该只有 渐变网格比较难吧，其他部分应该容易找。 "https://github.com/hakolao/wireframe" (https://link.segmentfault.com/?enc=mZSLqdfpEHP5Zg%2Bcs46nIw%3D%3D.%2FNFCLaOPwXunmnQy4VJ3IrM5a5cS7RtqRzR0IqEqCvCUjGTvgQqfQJmwugvqHyXE) *** 这个应该是你要找的示例代码了 "https://sbcode.net/threejs/displacmentmap/" (https://link.segmentfault.com/?enc=4yvZxdn%2FPpIfzxD9tSpKSA%3D%3D.MeNuLvRE71yx%2BtkJsX50bDRdBkfksQtXbS9qisN9w%2FdiXb%2F3Th%2BenvP%2B7JigrkcD) "https://medium.com/fink-it/colored-gradient-wireframe-model-in-three-js-b9cd4bfc0b92" (https://link.segmentfault.com/?enc=6bacsL1il00nePsL0wWWCg%3D%3D.TZKA%2FYR4yIrhJk2hBdt94Rg1ve5pK5Rp0LxdRHQWClDycm3Og3l1KJwwzmKVll%2BRUcNNFn%2Fqp6CTWMgsTWnX%2BcsuBDXqKo85Ut0vr4ODrnevD2h7dg8wnGQsM0D%2B8I0F) *** "Threejs 开发3D可视化地图" (https://link.segmentfault.com/?enc=eoMorPSqBz%2FUxO%2Fzai8lsg%3D%3D.8y1051NVt0Pfx2oyFyxs6KJsbE6cHZpntKlavlG%2F1Ooutl0qHNu3rOaRVqpBXrH4xNF9pL041Nx23A5j4vKGow%3D%3D) https://wmprod.oss-cn-shanghai.aliyuncs.com/c/user/20241004/dcf3d0700676f6456557dbdd1d2f9f51.png *** 找到一个 渐变网格的范例 下面 62票的答复里的 "Gradient with vertex colours" 看着可以借鉴 "Apply color gradient to material on mesh -three.js" (https://link.segmentfault.com/?enc=sM%2BjulO%2FpJW9WeIMTh%2FK8Q%3D%3D.vNkoAc7kiOKvVap6pk%2FsniI00YE%2FPsBj5cgom1tVeFn2Fc478Hr8HOavHBVBmuOtMMfbWjYygDQewToLaRoWVp6TivKpJO3DOgqOMWbYElBC0PQSOm3I99ZREMH92yG1)