使用 Three.js 创建气泡粒子效果，粒子从底部向上飘升，使用自定义 Bubble 类实现粒子系统。

bubble = new Bubble({
    speed: 0.8,
    size: 30,
    maxHeight: 10,
    color: "#ff0000",
});
scene.add(bubble);

let params = {
    speed: 0.8,
    size: 30,
    maxHeight: 10,
    color: "#1acdf9",
    count: 100,
    radius: 10,
    rotateSpeed: 0.01,
    backgroundColor: "#000000",
    emitter: "cone",
    emitterOptions: ["cone", "cylinder", "box", "sphere"],
};

gui.add(params, "speed", -2, 2).step(0.01).onChange((v) => (bubble.speed = v));
gui.add(params, "size").onChange((v) => (bubble.size = v));
gui.add(params, "maxHeight").onChange((v) => (bubble.maxHeight = v));
gui.addColor(params, "color").onChange((v) => (bubble.color = v));
gui.add(params, "count").onChange((v) => (bubble.count = v));
gui.add(params, "radius").onChange((v) => (bubble.radius = v));
gui.add(params, "rotateSpeed").onChange((v) => (bubble.rotateSpeed = v));
gui.addColor(params, "backgroundColor").name("背景色").onChange((v) => {
    scene.background = new THREE.Color(v);
});
gui.add(params, "emitter", params.emitterOptions).name("粒子发射方式").onChange((v) => {
    bubble.emitter = v;
});