Spaces:

awacke1
/

EKI-ALDI-Bayesian-Design

Running

App Files Files Community

awacke1 commited on 2 days ago

Commit

0ea72a5

verified ·

1 Parent(s): 314c009

Update index.html

Browse files

Files changed (1) hide show

index.html +59 -60

index.html CHANGED Viewed

@@ -7,97 +7,96 @@
     body { margin: 0; overflow: hidden; }
     #info {
       position: absolute;
-      top: 10px; left: 10px;
       color: #fff;
       font-family: sans-serif;
-      background: rgba(0,0,0,0.4);
-      padding: 8px 12px;
       border-radius: 4px;
-      font-size: 14px;
     }
   </style>
 </head>
 <body>
   <div id="info">
-    <strong>Particles:</strong> Ensemble Kalman Inversion (attraction to mean)<br/>
-    <strong>Noise:</strong> Affine-Invariant Langevin Dynamics
   </div>
   <script src="https://cdn.jsdelivr.net/npm/[email protected]/build/three.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/[email protected]/examples/js/controls/OrbitControls.js"></script>
   <script>
     // --- SCENE SETUP ---
-    let scene = new THREE.Scene();
-    let camera = new THREE.PerspectiveCamera(60, window.innerWidth / window.innerHeight, 0.1, 1000);
     camera.position.set(0, 0, 50);
-    let renderer = new THREE.WebGLRenderer({ antialias: true });
     renderer.setSize(window.innerWidth, window.innerHeight);
     document.body.appendChild(renderer.domElement);
-    let controls = new THREE.OrbitControls(camera, renderer.domElement);
     window.addEventListener('resize', () => {
-      camera.aspect = window.innerWidth / window.innerHeight;
       camera.updateProjectionMatrix();
       renderer.setSize(window.innerWidth, window.innerHeight);
     });
-    // --- PARTICLE SYSTEM PARAMETERS ---
-    const PARTICLE_COUNT = 100;
     const particles = [];
-    const geometry = new THREE.SphereGeometry(0.5, 8, 8);
-    // Initialize particles with random positions
-    for (let i = 0; i < PARTICLE_COUNT; i++) {
-      let material = new THREE.MeshBasicMaterial({
-        color: new THREE.Color(Math.random(), Math.random(), Math.random())
-      });
-      let p = new THREE.Mesh(geometry, material);
-      p.position.set(
-        (Math.random() - 0.5) * 40,
-        (Math.random() - 0.5) * 40,
-        (Math.random() - 0.5) * 40
-      );
-      particles.push(p);
-      scene.add(p);
     }
-    // --- UPDATE LOOP ---
-    function updateParticles() {
-      // 1) Compute ensemble mean
-      let mean = new THREE.Vector3();
-      particles.forEach(p => mean.add(p.position));
-      mean.divideScalar(PARTICLE_COUNT);
-      // 2) Compute a rough measure of covariance (average squared distance)
-      let cov = 0;
-      particles.forEach(p => cov += p.position.distanceToSquared(mean));
-      cov /= PARTICLE_COUNT;
-      // 3) For each particle: apply EKI‐style attraction + ALDI noise
-      const attractionStrength = 0.01;
-      const noiseScale = 0.1 * Math.sqrt(cov);
-      particles.forEach(p => {
-        // Attraction toward mean (EKI)
-        let toMean = mean.clone().sub(p.position).multiplyScalar(attractionStrength);
-        // Affine-Invariant Langevin noise
-        let noise = new THREE.Vector3(
-          (Math.random() - 0.5),
-          (Math.random() - 0.5),
-          (Math.random() - 0.5)
-        ).multiplyScalar(noiseScale);
-        // Update position
         p.position.add(toMean).add(noise);
       });
     }
-    // --- RENDER LOOP ---
-    function animate() {
       requestAnimationFrame(animate);
-      updateParticles();
       controls.update();
       renderer.render(scene, camera);
     }

     body { margin: 0; overflow: hidden; }
     #info {
       position: absolute;
+      top: 10px;
+      left: 10px;
+      background: rgba(0,0,0,0.6);
       color: #fff;
       font-family: sans-serif;
+      padding: 10px;
       border-radius: 4px;
+      max-width: 300px;
+      line-height: 1.4;
     }
+    #info h1 {
+      margin: 0 0 6px;
+      font-size: 16px;
+    }
+    #info p { margin: 4px 0; font-size: 13px; }
+    #info a { color: #66ccff; text-decoration: none; }
+    #info a:hover { text-decoration: underline; }
   </style>
 </head>
 <body>
   <div id="info">
+    <h1>Gradient-Free Sequential BOED</h1>
+    <p><strong>Gruhlke et al.</strong></p>
+    <p>
+      <a href="https://arxiv.org/abs/2504.13320" target="_blank">arXiv Abstract</a> |
+      <a href="https://arxiv.org/pdf/2504.13320" target="_blank">PDF</a>
+    </p>
+    <p style="font-size:12px;">
+      Uses Ensemble Kalman Inversion + Affine-Invariant Langevin sampling<br/>
+      for gradient-free sequential experimental design.
+    </p>
   </div>
   <script src="https://cdn.jsdelivr.net/npm/[email protected]/build/three.min.js"></script>
   <script src="https://cdn.jsdelivr.net/npm/[email protected]/examples/js/controls/OrbitControls.js"></script>
   <script>
     // --- SCENE SETUP ---
+    const scene = new THREE.Scene();
+    const camera = new THREE.PerspectiveCamera(60, window.innerWidth/window.innerHeight, 0.1, 1000);
     camera.position.set(0, 0, 50);
+    const renderer = new THREE.WebGLRenderer({ antialias: true });
     renderer.setSize(window.innerWidth, window.innerHeight);
     document.body.appendChild(renderer.domElement);
+    const controls = new THREE.OrbitControls(camera, renderer.domElement);
     window.addEventListener('resize', () => {
+      camera.aspect = window.innerWidth/window.innerHeight;
       camera.updateProjectionMatrix();
       renderer.setSize(window.innerWidth, window.innerHeight);
     });
+    // --- PARTICLES ---
+    const N = 100;
     const particles = [];
+    const sphereGeo = new THREE.SphereGeometry(0.5, 8, 8);
+    for(let i=0; i<N; i++){
+      const mat = new THREE.MeshBasicMaterial({ color: new THREE.Color(Math.random(),Math.random(),Math.random()) });
+      const m = new THREE.Mesh(sphereGeo, mat);
+      m.position.set((Math.random()-0.5)*40, (Math.random()-0.5)*40, (Math.random()-0.5)*40);
+      particles.push(m);
+      scene.add(m);
     }
+    function step(){
+      // ensemble mean
+      const mean = new THREE.Vector3();
+      particles.forEach(p=>mean.add(p.position));
+      mean.divideScalar(N);
+      // covariance proxy
+      let cov=0;
+      particles.forEach(p=>cov+=p.position.distanceToSquared(mean));
+      cov/=N;
+      const alpha=0.01, noiseAmp=0.1*Math.sqrt(cov);
+      particles.forEach(p=>{
+        // EKI attraction
+        const toMean = mean.clone().sub(p.position).multiplyScalar(alpha);
+        // ALDI noise
+        const noise = new THREE.Vector3(
+          (Math.random()-0.5),
+          (Math.random()-0.5),
+          (Math.random()-0.5)
+        ).multiplyScalar(noiseAmp);
         p.position.add(toMean).add(noise);
       });
     }
+    function animate(){
       requestAnimationFrame(animate);
+      step();
       controls.update();
       renderer.render(scene, camera);
     }