function VisualizateNeurons() {
scene = new THREE.Scene();
// set up the options for a perspective camera
const fov = 20;
const aspect = convas.clientWidth / convas.clientHeight;
const near = 0.1;
const far = 100000;
camera = new THREE.PerspectiveCamera(fov, aspect, near, far);
camera.position.set(0, 0, 300);
controls = new OrbitControls(camera, convas);
controls.enableDamping = true;
controls.enableZoom = true;
controls.dampingFactor = 0.25;
controls.screenSpacePanning = false;
controls.target.set(100, 50, 30);
controls.update();
//renderer.clear();
geometry = new THREE.BufferGeometry();
scene.background = new THREE.Color(params.Backgound);
const sprite = new THREE.TextureLoader().load(“disc.png”);
const vertices = ;
for (let i = 0; i < 100; i++) {
const x = Networks[i].x * scalingFactor;
const y = Networks[i].y * scalingFactor;
const z = Networks[i].z * scalingFactor;
vertices.push(x, y, z);
vertexColors.push(0.0, 0.0, 1.0);
}
geometry.setAttribute(
“position”,
new THREE.Float32BufferAttribute(vertices, 3)
);
geometry.setAttribute(
“color”,
new THREE.Float32BufferAttribute(vertexColors, 3)
);
material = new THREE.PointsMaterial({
size: parameters.SphereSize,
sizeAttenuation: false,
map: sprite,
alphaTest: parameters.alphaTest,
transparent: parameters.transparent,
vertexColors: true,
});
particles = new THREE.Points(geometry, material);
scene.add(particles);
particles.material.blending = THREE.AlwaysDepth;
renderer = new THREE.WebGLRenderer({
canvas: convas,
antialias: true,
});
renderer.setSize(convas.clientWidth, convas.clientHeight);
renderer.setPixelRatio(window.devicePixelRatio);
renderer.toneMapping = THREE.ReinhardToneMapping;
//////GUI panel code below
var gui = new GUI({ autoPlace: false });
gui.domElement.id = “gui”;
document.getElementById(“panel”).append(gui.domElement);
gui.addColor(params, “Backgound”).onChange(function (value) {
scene.background.set(value);
});
// Add controls to GUI
const cameraFolder = gui.addFolder(“Camera”);
cameraFolder.add(camera.position, “x”, 0, 1000).listen();
cameraFolder.add(camera.position, “y”, 0, 1000).listen();
cameraFolder.add(camera.position, “z”, 0, 1000).listen();
const pm = gui.addFolder(“Sphere Material”);
pm.add(parameters, “SphereSize”, 1, 20).onChange(function () {
material.size = parameters.SphereSize;
});
pm.add(material, “sizeAttenuation”).onChange(function () {
material.needsUpdate = true;
});
pm.add(parameters, “transparent”).onChange(function () {
material.transparent = parameters.transparent;
});
pm.add(parameters, “alphaTest”, 0.2, 1).onChange(function () {
material.alphaTest = parameters.alphaTest;
});
pm.add(material, “vertexColors”).onChange(function () {
material.needsUpdate = true;
});
const toneMappingFolder = gui.addFolder(“tone mapping”);
toneMappingFolder.add(para, “exposure”, 0.1, 2).onChange(function (value) {
renderer.toneMappingExposure = Math.pow(value, 4.0);
});
}