3D solar system · llama-3.1-70b-instruct
Using the pre-provided three.min.js (global THREE), build a 3D solar system with the sun and orbiting planets at varied speeds and sizes, orbit-drag camera controls, and a starfield.
transcript · 7 messages
Using the pre-provided three.min.js (global THREE), build a 3D solar system with the sun and orbiting planets at varied speeds and sizes, orbit-drag camera controls, and a starfield.
index.html (118 bytes)Successfully wrote 118 bytes to index.html
<function>write{"path": "index.html", "content": "three.min.js\" ></script><script>let scene, camera, renderer, planets = []\n\ninit()\nanimate()\n\nfunction init(){\n scene = new THREE.Scene()\n camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000)\n renderer = new THREE.WebGLRenderer()\n renderer.setSize(window.innerWidth, window.innerHeight)\n document.body.appendChild(renderer.domElement)\n\n camera.position.z = 5\n\n let sunGeometry = new THREE.SphereGeometry(1, 32, 32)\n let sunMaterial = new THREE.MeshBasicMaterial({color: 0xffffff})\n let sun = new THREE.Mesh(sunGeometry, sunMaterial)\n scene.add(sun)\n\n let starGeometry = new THREE.SphereGeometry(0.1, 32, 32)\n let starMaterial = new THREE.MeshBasicMaterial({color: 0xffffff})\n for(let i = 0; i < 100; i++){\n let star = new THREE.Mesh(starGeometry, starMaterial)\n star.position.set(Math.random() * 10, Math.random() * 10, Math.random() * 10)\n scene.add(star)\n }\n\n let mercuryGeometry = new THREE.SphereGeometry(0.2, 32, 32)\n let mercuryMaterial = new THREE.MeshBasicMaterial({color: 0x0000ff})\n let mercury = new THREE.Mesh(mercuryGeometry, mercuryMaterial)\n mercury.position.set(2, 0, 0)\n planets.push({mesh: mercury, speed: 0.01})\n scene.add(mercury)\n\n let venusGeometry = new THREE.SphereGeometry(0.3, 32, 32)\n let venusMaterial = new THREE.MeshBasicMaterial({color: 0x00ff00})\n let venus = new THREE.Mesh(venusGeometry, venusMaterial)\n venus.position.set(3, 0, 0)\n planets.push({mesh: venus, speed: 0.005})\n scene.add(venus)\n\n let earthGeometry = new THREE.SphereGeometry(0.4, 32, 32)\n let earthMaterial = new THREE.MeshBasicMaterial({color: 0x00ffff})\n let earth = new THREE.Mesh(earthGeometry, earthMaterial)\n earth.position.set(4, 0, 0)\n planets.push({mesh: earth, speed: 0.0025})\n scene.add(earth)\n\n let marsGeometry = new THREE.SphereGeometry(0.5, 32, 32)\n let marsMaterial = new THREE.MeshBasicMaterial({color: 0xff0000})\n let mars = new THREE.Mesh(marsGeometry, marsMaterial)\n mars.position.set(5, 0, 0)\n planets.push({mesh: mars, speed: 0.00125})\n scene.add(mars)\n\n let controls = new THREE.OrbitControls(camera, renderer.domElement)\n controls.update()\n}\n\nfunction animate(){\n requestAnimationFrame(animate)\n for(let i = 0; i < planets.length; i++){\n planets[i].mesh.rotation.y += planets[i].speed\n }\n renderer.render(scene, camera)\n}\n</script></body></html>"}</function>
TAKE IT TO CODE
A single self-contained HTML file — copy it and open in any browser, or reuse the prompt with your own pi-agent run.
RUN
EVALUATION
Entirely blank white page with no canvas or content across all frames and inputs.
Vision grade · anthropic/claude-sonnet-5
MEASUREMENTS
Raw readings from the capture, not a verdict — the grade above is the only judgement. Percentages are how much of the screen changed; the measure under-reports sparse motion on a dark background.