Converting from Geometry to BufferGeometry

So let me explain my problem in the simplest way I can.
I am migrating to the latest three.js version, and now my DodecahedronGeometry is a BufferGeometry instead of a regular geometry.
Before I was manipulating vertices but now it’s the triangles directly.
If you check what we do in this page:
Camberí - Web development Madrid (only the contact page, when scrolled down)
We have “spikes”, that is, vertices at random come in and out of the “sphere”. (simply multiplying the vertex by a scalar and a sin function)
The problem I face with BufferGeometry is that if I move triangle vertices at random they are not connected to the neighbour triangles, and the result is broken.
So, my question is:
How can I manipulate vertices in a BufferGeometry of a Dodecahedron so that the vertices of all the related triangles are affected, maintaining the geometry united?

A video of how it is broken right now:
Broken sphere

Thanks in advance!!

That happens because the geometry is non-indexed in this case. Meaning each triangle has its own unique set of vertices.

One way to solve the issue is the usage of BufferGeometryUtils.mergeVertices(). Because vertices can only be merged if the entire vertex data (vertex, normal, uvs, color etc.) are equal, it’s best for your use case to remove all buffer attributes except of position before using this method. Otherwise the merge won’t work as expected.

If you need normals, you can recompute them after the merge via computeVertexNormals(). The geometry will also be indexed, so modifying single vertices should affect all adjoining faces.

That was fast Mugen, thanks!
How do you use this class?

import * as THREE from "three";
        const geometry = new THREE.DodecahedronGeometry(SHAPE_RADIUS, 1);
        const merged = THREE.BufferGeometryUtils.mergeVertices(geometry);

This does not work, is it a different import?
I can’t find any example online

Yes, try it with:

import { BufferGeometryUtils } from 'three/examples/jsm/utils/BufferGeometryUtils.js';

The method is use in the examples a few times e.g.: three.js webgl - interactive particles

Ah awesome, you have helped me a ton :slight_smile: