Advanced Energy Conversion Simulations

RAMNOT Advance Energy Conversion Simulations

Neutron Capture Efficiency

Boron-10 Concentration (%):

Boron-10 Concentration: 50%

Gadolinium-157 Concentration (%):

Gadolinium-157 Concentration: 50%

Lithium-6 Concentration (%):

Lithium-6 Concentration: 50%

Neutron Flux (n/cm²/s):

Neutron Flux: 1e14 n/cm²/s

Neutron Cross Section (barns):

Neutron Cross Section: 500 barns

Material Density (g/cm³):

Material Density: 10 g/cm³

Neutron Capture Results

Neutron Capture Rate: 0

Material Integrity: 100%

Photon Absorption in Quantum Dots

Photon Energy (eV):

Photon Energy: 5 eV

Quantum Dot Bandgap (eV):

Quantum Dot Bandgap: 1.5 eV

Core Temperature (Kelvin):

Core Temperature: 1000 K

Photon Absorption Results

Total Energy Absorbed: 0 J

Absorption Efficiency: 0 %

Gamma Photon Attenuation

Initial Intensity (I₀):

Initial Intensity: 500

Linear Attenuation Coefficient (μ):

μ: 0.05

Material Thickness (cm):

Thickness: 5 cm

Final Intensity (I): 0

Compton Scattering

Initial Photon Energy (keV):

Photon Energy: 500 keV

Scattering Angle (degrees):

Angle: 45 degrees

Scattered Photon Energy: 0 keV

Advanced Energy Conversion Simulations

Overview

This web application simulates a variety of energy-related quantum experiments:

Neutron Capture Efficiency: Models neutron capture rates in various materials like Boron-10, Gadolinium-157, and Lithium-6.
Photon Absorption in Quantum Dots: Simulates photon absorption based on photon energy and quantum dot bandgap.
Gamma Photon Attenuation: Simulates how gamma photons attenuate through materials of different thicknesses and attenuation coefficients.
Compton Scattering: Models the scattering of photons based on scattering angles and photon energy.

Project Structure

HTML Structure

The page consists of four tabs, each corresponding to an experiment. Each tab has interactive sliders to control various parameters, and the results are visualized through real-time graphs using Chart.js.

Scripts and Libraries

Chart.js: Used to render interactive graphs that visualize the results of each simulation.
JavaScript: Handles calculations, simulations, and dynamically updates the graphs based on user input.

1. Neutron Capture Efficiency Simulation

In this simulation, users can adjust the concentration of Boron-10, Gadolinium-157, and Lithium-6, along with other neutron flux parameters, to see how it affects neutron capture rates in materials.

Key Functions

updateNeutronCaptureRate(): Calculates the neutron capture rate using the macroscopic cross-section and neutron flux.
calculateDegradation(): Models the material degradation over time based on neutron capture rates.

Important Calculations

Macroscopic Cross-Section: numberDensity * neutronCrossSection (used to calculate the capture rate).
Degradation Rate: Proportional to the capture rate, affects material integrity over time.

Charts

Neutron Capture Rate Chart: Displays how the neutron capture rate changes over time based on input parameters.
Neutron Heatmap: Visualizes the relationships between neutron capture rates and material concentrations.

2. Photon Absorption in Quantum Dots

This section simulates photon absorption in quantum dots. Users can adjust photon energy, quantum dot bandgap, and core temperature to see how absorption efficiency changes.

Key Functions

runPhotonSimulation(): Calculates the absorption efficiency based on photon energy and the temperature-dependent bandgap.

Important Calculations

Absorption Efficiency: The percentage of energy absorbed by the quantum dot, calculated using ((photonEnergy - tempBandgap) / photonEnergy) * 100.

Charts

Photon Absorption Efficiency: Displays how efficiently photons are absorbed based on the input parameters.
Pie Chart: Shows the absorbed vs. unabsorbed photon energy.

3. Gamma Photon Attenuation

In this section, users simulate how gamma photons attenuate through different materials by adjusting the initial intensity, attenuation coefficient (μ), and material thickness.

Key Functions

calculateAttenuation(): Uses the exponential attenuation formula to calculate the final intensity of photons after passing through a material.

Important Calculations

Attenuation Formula: I = I₀ * exp(-μ * thickness), where I is the final intensity.

Charts

Attenuation Chart: Displays the reduction in photon intensity after attenuation.

4. Compton Scattering

This simulation allows users to explore Compton scattering, where photon energy and scattering angle affect the final energy of the scattered photon.

Key Functions

calculateScattering(): Calculates the energy of scattered photons using the Compton scattering equation.

Important Calculations

Compton Scattering Equation: E' = E / (1 + (E / mₑc²) * (1 - cosθ)), where E' is the scattered energy and θ is the scattering angle.

Charts

Scattering Chart: Plots photon energy against the scattering angle, showing how energy changes with angle.

Explore the Code (Interactive)

Here is a snippet of the HTML structure for the Advanced Energy Conversion Simulations project. You can scroll through the code and explore how the webpage is built:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <title>Advanced Energy Conversion Simulations</title>
    
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    
</head>

<body>

<div class="container">
        <h1>Energy Conversion Simulations</h1>

<div class="tab-buttons">
            <button id="neutronTab" class="active" onclick="showTab('neutron')">Neutron Capture Efficiency</button>
            <button id="photonTab" onclick="showTab('photon')">Photon Absorption in Quantum Dots</button>
            <button id="gammaTab" onclick="showTab('gamma')">Gamma Photon Attenuation</button>
            <button id="comptonTab" onclick="showTab('compton')">Compton Scattering</button>
        </div>

<div id="neutron" class="tab-content active">
            <h2>Neutron Capture Efficiency</h2>
            <div class="grid-container">
                <div class="grid-item">
                    
                    <div class="slider-container">
                        <label for="boronSlider">Boron-10 Concentration (%):</label>
                        <input type="range" id="boronSlider" min="0" max="100" step="1" value="50"
                            oninput="updateBoronSlider(this.value)" title="Adjust Boron-10 Concentration">
                        <p>Boron-10 Concentration: <span id="boronValue">50</span>%</p>
                    </div>

<div class="slider-container">
                        <label for="gadoliniumSlider">Gadolinium-157 Concentration (%):</label>
                        <input type="range" id="gadoliniumSlider" min="0" max="100" step="1" value="50"
                            oninput="updateGadoliniumSlider(this.value)" title="Adjust Gadolinium-157 Concentration">
                        <p>Gadolinium-157 Concentration: <span id="gadoliniumValue">50</span>%</p>
                    </div>

<div class="slider-container">
                        <label for="lithiumSlider">Lithium-6 Concentration (%):</label>
                        <input type="range" id="lithiumSlider" min="0" max="100" step="1" value="50"
                            oninput="updateLithiumSlider(this.value)" title="Adjust Lithium-6 Concentration">
                        <p>Lithium-6 Concentration: <span id="lithiumValue">50</span>%</p>
                    </div>

<div class="slider-container">
                        <label for="fluxSlider">Neutron Flux (n/cm²/s):</label>
                        <input type="range" id="fluxSlider" min="12" max="20" step="1" value="14"
                            oninput="updateFluxSlider(this.value)" title="Adjust Neutron Flux">
                        <p>Neutron Flux: <span id="fluxValue">1e14</span> n/cm²/s</p>
                    </div>

<div class="slider-container">
                        <label for="crossSectionSlider">Neutron Cross Section (barns):</label>
                        <input type="range" id="crossSectionSlider" min="0.1" max="1000" step="0.1" value="500"
                            oninput="updateCrossSectionSlider(this.value)" title="Adjust Neutron Cross Section">
                        <p>Neutron Cross Section: <span id="crossSectionValue">500</span> barns</p>
                    </div>

<div class="slider-container">
                        <label for="materialDensitySlider">Material Density (g/cm³):</label>
                        <input type="range" id="materialDensitySlider" min="1" max="20" step="0.1" value="10"
                            oninput="updateMaterialDensitySlider(this.value)" title="Adjust Material Density">
                        <p>Material Density: <span id="materialDensityValue">10</span> g/cm³</p>
                    </div>
                </div>

<div class="grid-item">
                    <canvas id="neutronChart" width="300" height="200"></canvas>
                    <div>
                        <button class="btn btn-primary" onclick="startNeutronSimulation()">Start Neutron
                            Simulation</button>
                        <button class="btn btn-danger" onclick="stopNeutronSimulation()">Stop Simulation</button>
                    </div>
                    <canvas id="neutronHeatmap" width="300" height="200"></canvas>

<div id="neutron-results">
                        <h3>Neutron Capture Results</h3>
                        <p>Neutron Capture Rate: <span id="neutronCaptureRate">0</span></p>
                        <p>Material Integrity: <span id="materialIntegrity">100%</span></p>
                    </div>
                </div>
            </div>
        </div>

<div id="photon" class="tab-content">
            <h2>Photon Absorption in Quantum Dots</h2>
            <div class="grid-container">
                <div class="grid-item">
                    <div class="slider-container">
                        <label for="energySlider">Photon Energy (eV):</label>
                        <input type="range" id="energySlider" min="1" max="20" step="0.5" value="5"
                            oninput="updateEnergySlider(this.value)" title="Adjust Photon Energy">
                        <p>Photon Energy: <span id="energyValue">5</span> eV</p>
                    </div>

<div class="slider-container">
                        <label for="bandgapSlider">Quantum Dot Bandgap (eV):</label>
                        <input type="range" id="bandgapSlider" min="0.5" max="10" step="0.1" value="1.5"
                            oninput="updateBandgapSlider(this.value)" title="Adjust Quantum Dot Bandgap">
                        <p>Quantum Dot Bandgap: <span id="bandgapValue">1.5</span> eV</p>
                    </div>

<div class="slider-container">
                        <label for="temperatureSlider">Core Temperature (Kelvin):</label>
                        <input type="range" id="temperatureSlider" min="300" max="2000" step="10" value="1000"
                            oninput="updateTemperatureSlider(this.value)" title="Adjust Core Temperature">
                        <p>Core Temperature: <span id="temperatureValue">1000</span> K</p>
                    </div>
                </div>

<div class="grid-item">
                    <canvas id="photonChart" width="300" height="200"></canvas>
                    <div>
                        <button class="btn btn-primary" onclick="startPhotonSimulation()">Start Photon
                            Simulation</button>
                        <button class="btn btn-danger" onclick="stopPhotonSimulation()">Stop Simulation</button>
                    </div>
                    <canvas id="photonPieChart" width="300" height="200"></canvas>
                    <canvas id="photonHistogram" width="300" height="200"></canvas>

<div id="photon-results">
                        <h3>Photon Absorption Results</h3>
                        <p>Total Energy Absorbed: <span id="totalEnergyAbsorbed">0</span> J</p>
                        <p>Absorption Efficiency: <span id="absorptionEfficiency">0</span> %</p>
                    </div>
                </div>
            </div>
        </div>

<div id="gamma" class="tab-content">
            <h2>Gamma Photon Attenuation</h2>
            <div class="grid-container">
                <div class="grid-item">
                    <div class="slider-container">
                        <label for="intensitySlider">Initial Intensity (I₀):</label>
                        <input type="range" id="intensitySlider" min="100" max="1000" step="10" value="500"
                            oninput="updateIntensitySlider(this.value)" title="Adjust Initial Intensity">
                        <p>Initial Intensity: <span id="intensityValue">500</span></p>
                    </div>
                    <div class="slider-container">
                        <label for="muSlider">Linear Attenuation Coefficient (μ):</label>
                        <input type="range" id="muSlider" min="0.01" max="0.1" step="0.01" value="0.05"
                            oninput="updateMuSlider(this.value)" title="Adjust Linear Attenuation Coefficient">
                        <p>μ: <span id="muValue">0.05</span></p>
                    </div>
                    <div class="slider-container">
                        <label for="thicknessSlider">Material Thickness (cm):</label>
                        <input type="range" id="thicknessSlider" min="1" max="10" step="1" value="5"
                            oninput="updateThicknessSlider(this.value)" title="Adjust Material Thickness">
                        <p>Thickness: <span id="thicknessValue">5</span> cm</p>
                    </div>
                    <div>
                        <button class="btn btn-primary" onclick="startGammaSimulation()">Start Gamma Simulation</button>
                        <button class="btn btn-danger" onclick="stopGammaSimulation()">Stop Simulation</button>
                    </div>
                    <p>Final Intensity (I): <span id="attenuationResult">0</span></p>
                </div>

<div id="compton" class="tab-content">
            <h2>Compton Scattering</h2>
            <div class="grid-container">
                <div class="grid-item">
                    <div class="slider-container">
                        <label for="photonEnergySlider">Initial Photon Energy (keV):</label>
                        <input type="range" id="photonEnergySlider" min="100" max="1000" step="10" value="500"
                            oninput="updatePhotonEnergySlider(this.value)" title="Adjust Initial Photon Energy">
                        <p>Photon Energy: <span id="photonEnergyValue">500</span> keV</p>
                    </div>
                    <div class="slider-container">
                        <label for="angleSlider">Scattering Angle (degrees):</label>
                        <input type="range" id="angleSlider" min="0" max="180" step="5" value="45"
                            oninput="updateAngleSlider(this.value)" title="Adjust Scattering Angle">
                        <p>Angle: <span id="angleValue">45</span> degrees</p>
                    </div>
                    <div>
                        <button class="btn btn-primary" onclick="startComptonSimulation()">Start Compton
                            Simulation</button>
                        <button class="btn btn-danger" onclick="stopComptonSimulation()">Stop Simulation</button>
                    </div>
                    <p>Scattered Photon Energy: <span id="scatteredEnergyResult">0</span> keV</p>
                </div>

// Global variables for the experiments
        let intensity = 500;
        let mu = 0.05;
        let thickness = 5;
        let angle = 45;

// Track charts so we can update them dynamically
        let gammaChart;
        let comptonChart;
        let comptonSimulationInterval, gammaSimulationInterval;

// Tab switching logic
        function showTab(tab) {
            document.querySelectorAll('.tab-buttons button').forEach(button => button.classList.remove('active'));
            document.querySelectorAll('.tab-content').forEach(content => content.classList.remove('active'));

document.getElementById(tab).classList.add('active');
            document.getElementById(`${tab}Tab`).classList.add('active');
        }

// Neutron Capture Simulation Functions
        function updateFluxSlider(value) {
            neutronFlux = Math.pow(10, parseInt(value));
            document.getElementById('fluxValue').textContent = neutronFlux.toExponential();
            calculateNeutronCaptureRate();
            calculateDegradation();
            updateNeutronChart(neutronCaptureRate);
            updateNeutronHeatmap([
                { x: boronConcentration, y: gadoliniumConcentration, v: neutronCaptureRate },
                { x: boronConcentration, y: lithiumConcentration, v: neutronCaptureRate },
                { x: gadoliniumConcentration, y: lithiumConcentration, v: neutronCaptureRate }
            ]);
        }

function calculateNeutronCaptureRate() {
            const avogadroNumber = 6.022e23;
            const atomicMass = 235;
            const numberDensity = (materialDensity * avogadroNumber) / atomicMass;

const macroscopicCrossSection = numberDensity * neutronCrossSection * 1e-24;
            neutronCaptureRate = macroscopicCrossSection * neutronFlux;

document.getElementById('neutronCaptureRate').textContent = neutronCaptureRate.toExponential(2);
        }

function calculateDegradation() {
            const degradationRate = 0.01 * neutronCaptureRate;
            materialIntegrity -= degradationRate;

if (materialIntegrity < 0) {
                materialIntegrity = 0;
            }

document.getElementById('materialIntegrity').textContent = materialIntegrity.toFixed(2) + "%";
        }

function stopNeutronSimulation() {
            clearInterval(neutronSimulationInterval);
        }

// Photon Absorption Simulation Functions
        function updateEnergySlider(value) {
            photonEnergy = parseFloat(value);
            document.getElementById('energyValue').textContent = photonEnergy.toFixed(2);
            runPhotonSimulation();
        }

function updateBandgapSlider(value) {
            quantumDotBandgap = parseFloat(value);
            document.getElementById('bandgapValue').textContent = quantumDotBandgap.toFixed(2);
            runPhotonSimulation();
        }

function updateTemperatureSlider(value) {
            coreTemperature = parseFloat(value);
            document.getElementById('temperatureValue').textContent = coreTemperature;
            runPhotonSimulation();
        }

function calculateTemperatureEffectOnBandgap() {
            const alpha = 4.73e-4;
            const beta = 636;
            const zeroTempBandgap = 1.12;
            return zeroTempBandgap - (alpha * coreTemperature ** 2) / (coreTemperature + beta);
        }

function runPhotonSimulation() {
            const tempBandgap = calculateTemperatureEffectOnBandgap();

if (photonEnergy > tempBandgap) {
                absorptionEfficiency = ((photonEnergy - tempBandgap) / photonEnergy) * 100;
                totalEnergyAbsorbed += photonEnergy * 1.60218e-19 * absorptionEfficiency;
            } else {
                absorptionEfficiency = 0;
            }

document.getElementById('absorptionEfficiency').textContent = absorptionEfficiency.toFixed(2);
            document.getElementById('totalEnergyAbsorbed').textContent = totalEnergyAbsorbed.toExponential(2);

updatePhotonChart(absorptionEfficiency);
            updatePhotonPieChart(totalEnergyAbsorbed, photonEnergy * 1.60218e-19 - totalEnergyAbsorbed);
            updatePhotonHistogram({
                labels: ['1 eV', '2 eV', '3 eV', '4 eV', '5 eV'],
                values: [10, 20, 30, 40, 50]
            });
        }

function startPhotonSimulation() {
            stopPhotonSimulation();
            photonSimulationInterval = setInterval(runPhotonSimulation, 1000);
        }

function stopPhotonSimulation() {
            clearInterval(photonSimulationInterval);
        }

// Gamma Photon Attenuation Functions
        function updateIntensitySlider(value) {
            intensity = parseFloat(value);
            document.getElementById('intensityValue').textContent = value;
            calculateAttenuation();
        }

function updateMuSlider(value) {
            mu = parseFloat(value);
            document.getElementById('muValue').textContent = value;
            calculateAttenuation();
        }

function updateThicknessSlider(value) {
            thickness = parseFloat(value);
            document.getElementById('thicknessValue').textContent = value;
            calculateAttenuation();
        }

function startGammaSimulation() {
            stopGammaSimulation();
            gammaSimulationInterval = setInterval(calculateAttenuation, 1000);
        }

function stopGammaSimulation() {
            clearInterval(gammaSimulationInterval);
        }

function calculateAttenuation() {
            const finalIntensity = intensity * Math.exp(-mu * thickness);
            document.getElementById('attenuationResult').textContent = finalIntensity.toFixed(2);
            updateGammaChart(finalIntensity);
        }

// Compton Scattering Functions
        function updatePhotonEnergySlider(value) {
            photonEnergy = parseFloat(value);
            document.getElementById('photonEnergyValue').textContent = value;
            calculateScattering();
        }

function updateAngleSlider(value) {
            angle = parseFloat(value);
            document.getElementById('angleValue').textContent = value;
            calculateScattering();
        }

function startComptonSimulation() {
            stopComptonSimulation();
            comptonSimulationInterval = setInterval(simulateComptonScatter, 500); // Simulate every 0.5 seconds
        }

function stopComptonSimulation() {
            clearInterval(comptonSimulationInterval);
        }

function calculateScattering() {
            const theta = angle;
            const E = photonEnergy * 1000; // Convert keV to eV
            const radTheta = theta * Math.PI / 180; // Convert degrees to radians
            const me_c2 = 511e3; // Electron rest mass energy in eV
            const scatteredEnergy = E / (1 + (E / me_c2) * (1 - Math.cos(radTheta)));

document.getElementById('scatteredEnergyResult').textContent = (scatteredEnergy / 1000).toFixed(2); // Display in keV
            updateComptonChart(theta, scatteredEnergy / 1000, true); // Recalculate with new inputs and change color
        }

function simulateComptonScatter() {
            const theta = Math.random() * 180; // Random angle between 0 and 180 degrees
            const E = photonEnergy * 1000; // Convert keV to eV
            const radTheta = theta * Math.PI / 180; // Convert degrees to radians
            const me_c2 = 511e3; // Electron rest mass energy in eV
            const scatteredEnergy = E / (1 + (E / me_c2) * (1 - Math.cos(radTheta)));

document.getElementById('scatteredEnergyResult').textContent = (scatteredEnergy / 1000).toFixed(2); // Display in keV
            updateComptonChart(theta, scatteredEnergy / 1000, false);
        }

// Charts Setup
        const neutronCtx = document.getElementById('neutronChart').getContext('2d');
        const neutronChartData = { labels: [], datasets: [{ label: 'Neutron Capture Rate (reactions/s)', borderColor: '#007aff', data: [] }] };
        const neutronChart = new Chart(neutronCtx, { type: 'line', data: neutronChartData });

function updateNeutronChart(captureRate) {
            neutronChartData.labels.push(neutronChartData.labels.length);
            neutronChartData.datasets[0].data.push(captureRate);
            neutronChart.update();
        }

function updatePhotonChart(efficiency) {
            photonChartData.labels.push(photonChartData.labels.length);
            photonChartData.datasets[0].data.push(efficiency);
            photonChart.update();
        }

// Neutron Heatmap
        let neutronHeatmapChart;
        function updateNeutronHeatmap(data) {
            const ctx = document.getElementById('neutronHeatmap').getContext('2d');
            if (neutronHeatmapChart) {
                neutronHeatmapChart.destroy();
            }
            neutronHeatmapChart = new Chart(ctx, {
                type: 'heatmap',
                data: {
                    labels: ['Boron-10', 'Gadolinium-157', 'Lithium-6'],
                    datasets: [{
                        label: 'Neutron Capture Rate',
                        data: data,
                        backgroundColor: 'rgba(0, 122, 255, 0.5)'
                    }]
                },
                options: {
                    scales: {
                        x: { beginAtZero: true },
                        y: { beginAtZero: true }
                    }
                }
            });
        }

// Photon Pie Chart
        let photonPieChart;
        function updatePhotonPieChart(absorbed, notAbsorbed) {
            const ctx = document.getElementById('photonPieChart').getContext('2d');
            if (photonPieChart) {
                photonPieChart.destroy();
            }
            photonPieChart = new Chart(ctx, {
                type: 'pie',
                data: {
                    labels: ['Absorbed', 'Not Absorbed'],
                    datasets: [{
                        data: [absorbed, notAbsorbed],
                        backgroundColor: ['#ff5733', '#007aff']
                    }]
                },
                options: {
                    responsive: true
                }
            });
        }

// Photon Histogram
        let photonHistogramChart;
        function updatePhotonHistogram(data) {
            const ctx = document.getElementById('photonHistogram').getContext('2d');
            if (photonHistogramChart) {
                photonHistogramChart.destroy();
            }
            photonHistogramChart = new Chart(ctx, {
                type: 'bar',
                data: {
                    labels: data.labels,
                    datasets: [{
                        label: 'Absorption Efficiency (%)',
                        data: data.values,
                        backgroundColor: '#ff5733'
                    }]
                },
                options: {
                    scales: {
                        x: { beginAtZero: true },
                        y: { beginAtZero: true }
                    }
                }
            });
        }

// Example data for heatmap, pie chart, and histogram
        const neutronHeatmapData = [
            { x: 0, y: 0, v: 10 },
            { x: 1, y: 1, v: 20 },
            { x: 2, y: 2, v: 30 }
        ];
        updateNeutronHeatmap(neutronHeatmapData);

const absorbed = 70;
        const notAbsorbed = 30;
        updatePhotonPieChart(absorbed, notAbsorbed);

const photonHistogramData = {
            labels: ['1 eV', '2 eV', '3 eV', '4 eV', '5 eV'],
            values: [10, 20, 30, 40, 50]
        };
        updatePhotonHistogram(photonHistogramData);
    </script>
</body>
</html>

xxxxxxxxxx
 
<!DOCTYPE html>
<html lang="en">
​
<head>
    <meta charset="UTF-8">
    <title>Advanced Energy Conversion Simulations</title>
    <!-- Chart.js for graph plotting -->
    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
    
</head>
​
<body>
​
    <div class="container">
        <h1>Energy Conversion Simulations</h1>
​
        <div class="tab-buttons">
            <button id="neutronTab" class="active" onclick="showTab('neutron')">Neutron Capture Efficiency</button>
            <button id="photonTab" onclick="showTab('photon')">Photon Absorption in Quantum Dots</button>
            <button id="gammaTab" onclick="showTab('gamma')">Gamma Photon Attenuation</button>
            <button id="comptonTab" onclick="showTab('compton')">Compton Scattering</button>
        </div>
​
        <!-- Neutron Capture Efficiency Simulation -->
        <div id="neutron" class="tab-content active">
            <h2>Neutron Capture Efficiency</h2>
            <div class="grid-container">
                <div class="grid-item">
                    <!-- Boron-10 Slider -->
                    <div class="slider-container">
                        <label for="boronSlider">Boron-10 Concentration (%):</label>
                        <input type="range" id="boronSlider" min="0" max="100" step="1" value="50"
                            oninput="updateBoronSlider(this.value)" title="Adjust Boron-10 Concentration">
                        <p>Boron-10 Concentration: <span id="boronValue">50</span>%</p>
                    </div>
​
                    <!-- Gadolinium-157 Slider -->
                    <div class="slider-container">
                        <label for="gadoliniumSlider">Gadolinium-157 Concentration (%):</label>
                        <input type="range" id="gadoliniumSlider" min="0" max="100" step="1" value="50"
                            oninput="updateGadoliniumSlider(this.value)" title="Adjust Gadolinium-157 Concentration">
                        <p>Gadolinium-157 Concentration: <span id="gadoliniumValue">50</span>%</p>
                    </div>
​
                    <!-- Lithium-6 Slider -->
                    <div class="slider-container">
                        <label for="lithiumSlider">Lithium-6 Concentration (%):</label>
                        <input type="range" id="lithiumSlider" min="0" max="100" step="1" value="50"
                            oninput="updateLithiumSlider(this.value)" title="Adjust Lithium-6 Concentration">
                        <p>Lithium-6 Concentration: <span id="lithiumValue">50</span>%</p>
                    </div>
​
                    <div class="slider-container">
                        <label for="fluxSlider">Neutron Flux (n/cm²/s):</label>
                        <input type="range" id="fluxSlider" min="12" max="20" step="1" value="14"
                            oninput="updateFluxSlider(this.value)" title="Adjust Neutron Flux">
                        <p>Neutron Flux: <span id="fluxValue">1e14</span> n/cm²/s</p>
                    </div>
​
                    <div class="slider-container">
                        <label for="crossSectionSlider">Neutron Cross Section (barns):</label>
                        <input type="range" id="crossSectionSlider" min="0.1" max="1000" step="0.1" value="500"
                            oninput="updateCrossSectionSlider(this.value)" title="Adjust Neutron Cross Section">
                        <p>Neutron Cross Section: <span id="crossSectionValue">500</span> barns</p>
                    </div>
​
                    <div class="slider-container">
                        <label for="materialDensitySlider">Material Density (g/cm³):</label>
                        <input type="range" id="materialDensitySlider" min="1" max="20" step="0.1" value="10"
                            oninput="updateMaterialDensitySlider(this.value)" title="Adjust Material Density">
                        <p>Material Density: <span id="materialDensityValue">10</span> g/cm³</p>
                    </div>
                </div>
​
                <div class="grid-item">
                    <canvas id="neutronChart" width="300" height="200"></canvas>
                    <div>
                        <button class="btn btn-primary" onclick="startNeutronSimulation()">Start Neutron
                            Simulation</button>
                        <button class="btn btn-danger" onclick="stopNeutronSimulation()">Stop Simulation</button>
                    </div>
                    <canvas id="neutronHeatmap" width="300" height="200"></canvas>
​
                    <!-- Results for Neutron Capture -->
                    <div id="neutron-results">
                        <h3>Neutron Capture Results</h3>
                        <p>Neutron Capture Rate: <span id="neutronCaptureRate">0</span></p>
                        <p>Material Integrity: <span id="materialIntegrity">100%</span></p>
                    </div>
                </div>
            </div>
        </div>
​
        <!-- Photon Absorption Simulation -->
        <div id="photon" class="tab-content">
            <h2>Photon Absorption in Quantum Dots</h2>
            <div class="grid-container">
                <div class="grid-item">
                    <div class="slider-container">
                        <label for="energySlider">Photon Energy (eV):</label>
                        <input type="range" id="energySlider" min="1" max="20" step="0.5" value="5"
                            oninput="updateEnergySlider(this.value)" title="Adjust Photon Energy">
                        <p>Photon Energy: <span id="energyValue">5</span> eV</p>
                    </div>
​
                    <div class="slider-container">
                        <label for="bandgapSlider">Quantum Dot Bandgap (eV):</label>
                        <input type="range" id="bandgapSlider" min="0.5" max="10" step="0.1" value="1.5"
                            oninput="updateBandgapSlider(this.value)" title="Adjust Quantum Dot Bandgap">
                        <p>Quantum Dot Bandgap: <span id="bandgapValue">1.5</span> eV</p>
                    </div>
​
                    <div class="slider-container">
                        <label for="temperatureSlider">Core Temperature (Kelvin):</label>
                        <input type="range" id="temperatureSlider" min="300" max="2000" step="10" value="1000"
                            oninput="updateTemperatureSlider(this.value)" title="Adjust Core Temperature">
                        <p>Core Temperature: <span id="temperatureValue">1000</span> K</p>
                    </div>
                </div>
​
                <div class="grid-item">
                    <canvas id="photonChart" width="300" height="200"></canvas>
                    <div>
                        <button class="btn btn-primary" onclick="startPhotonSimulation()">Start Photon
                            Simulation</button>
                        <button class="btn btn-danger" onclick="stopPhotonSimulation()">Stop Simulation</button>
                    </div>
                    <canvas id="photonPieChart" width="300" height="200"></canvas>
                    <canvas id="photonHistogram" width="300" height="200"></canvas>
​
                    <!-- Results for Photon Absorption -->
                    <div id="photon-results">
                        <h3>Photon Absorption Results</h3>
                        <p>Total Energy Absorbed: <span id="totalEnergyAbsorbed">0</span> J</p>
                        <p>Absorption Efficiency: <span id="absorptionEfficiency">0</span> %</p>
                    </div>
                </div>
            </div>
        </div>
​
        <!-- Gamma Photon Attenuation -->
        <div id="gamma" class="tab-content">
            <h2>Gamma Photon Attenuation</h2>
            <div class="grid-container">
                <div class="grid-item">
                    <div class="slider-container">
                        <label for="intensitySlider">Initial Intensity (I₀):</label>
                        <input type="range" id="intensitySlider" min="100" max="1000" step="10" value="500"
                            oninput="updateIntensitySlider(this.value)" title="Adjust Initial Intensity">
                        <p>Initial Intensity: <span id="intensityValue">500</span></p>
                    </div>
                    <div class="slider-container">
                        <label for="muSlider">Linear Attenuation Coefficient (μ):</label>
                        <input type="range" id="muSlider" min="0.01" max="0.1" step="0.01" value="0.05"
                            oninput="updateMuSlider(this.value)" title="Adjust Linear Attenuation Coefficient">
                        <p>μ: <span id="muValue">0.05</span></p>
                    </div>
                    <div class="slider-container">
                        <label for="thicknessSlider">Material Thickness (cm):</label>
                        <input type="range" id="thicknessSlider" min="1" max="10" step="1" value="5"
                            oninput="updateThicknessSlider(this.value)" title="Adjust Material Thickness">
                        <p>Thickness: <span id="thicknessValue">5</span> cm</p>
                    </div>
                    <div>
                        <button class="btn btn-primary" onclick="startGammaSimulation()">Start Gamma Simulation</button>
                        <button class="btn btn-danger" onclick="stopGammaSimulation()">Stop Simulation</button>
                    </div>
                    <p>Final Intensity (I): <span id="attenuationResult">0</span></p>
                </div>
​
                <div class="grid-item">
                    <canvas id="gammaChart" width="300" height="200"></canvas>
                </div>
            </div>
        </div>
​
        <!-- Compton Scattering Simulation -->
        <div id="compton" class="tab-content">
            <h2>Compton Scattering</h2>
            <div class="grid-container">
                <div class="grid-item">
                    <div class="slider-container">
                        <label for="photonEnergySlider">Initial Photon Energy (keV):</label>
                        <input type="range" id="photonEnergySlider" min="100" max="1000" step="10" value="500"
                            oninput="updatePhotonEnergySlider(this.value)" title="Adjust Initial Photon Energy">
                        <p>Photon Energy: <span id="photonEnergyValue">500</span> keV</p>
                    </div>
                    <div class="slider-container">
                        <label for="angleSlider">Scattering Angle (degrees):</label>
                        <input type="range" id="angleSlider" min="0" max="180" step="5" value="45"
                            oninput="updateAngleSlider(this.value)" title="Adjust Scattering Angle">
                        <p>Angle: <span id="angleValue">45</span> degrees</p>
                    </div>
                    <div>
                        <button class="btn btn-primary" onclick="startComptonSimulation()">Start Compton
                            Simulation</button>
                        <button class="btn btn-danger" onclick="stopComptonSimulation()">Stop Simulation</button>
                    </div>
                    <p>Scattered Photon Energy: <span id="scatteredEnergyResult">0</span> keV</p>
                </div>
​
                <div class="grid-item">
                    <canvas id="comptonChart" width="300" height="200"></canvas>
                </div>
            </div>
        </div>
    </div>
​
    <script>
        // Global variables for simulation
        let neutronSimulationInterval, photonSimulationInterval;
        let neutronFlux = 1e14;
        let neutronCrossSection = 500;
        let materialDensity = 10;
        let photonEnergy = 5;
        let quantumDotBandgap = 1.5;
        let coreTemperature = 1000;
        let neutronCaptureRate = 0;
        let totalEnergyAbsorbed = 0;
        let absorptionEfficiency = 0;
        let materialIntegrity = 100;
        let boronConcentration = 50;
        let gadoliniumConcentration = 50;
        let lithiumConcentration = 50;
​
        // Global variables for the experiments
        let intensity = 500;
        let mu = 0.05;
        let thickness = 5;
        let angle = 45;
​
        // Track charts so we can update them dynamically
        let gammaChart;
        let comptonChart;
        let comptonSimulationInterval, gammaSimulationInterval;
​
        // Tab switching logic
        function showTab(tab) {
            document.querySelectorAll('.tab-buttons button').forEach(button => button.classList.remove('active'));
            document.querySelectorAll('.tab-content').forEach(content => content.classList.remove('active'));
​
            document.getElementById(tab).classList.add('active');
            document.getElementById(`${tab}Tab`).classList.add('active');
        }
​
        // Neutron Capture Simulation Functions
        function updateFluxSlider(value) {
            neutronFlux = Math.pow(10, parseInt(value));
            document.getElementById('fluxValue').textContent = neutronFlux.toExponential();
            calculateNeutronCaptureRate();
            calculateDegradation();
            updateNeutronChart(neutronCaptureRate);
            updateNeutronHeatmap([
                { x: boronConcentration, y: gadoliniumConcentration, v: neutronCaptureRate },
                { x: boronConcentration, y: lithiumConcentration, v: neutronCaptureRate },
                { x: gadoliniumConcentration, y: lithiumConcentration, v: neutronCaptureRate }
            ]);
        }
​
        function updateCrossSectionSlider(value) {
            neutronCrossSection = parseFloat(value);
            document.getElementById('crossSectionValue').textContent = neutronCrossSection.toFixed(2);
            calculateNeutronCaptureRate();
            calculateDegradation();
            updateNeutronChart(neutronCaptureRate);
            updateNeutronHeatmap([
                { x: boronConcentration, y: gadoliniumConcentration, v: neutronCaptureRate },
                { x: boronConcentration, y: lithiumConcentration, v: neutronCaptureRate },
                { x: gadoliniumConcentration, y: lithiumConcentration, v: neutronCaptureRate }
            ]);
        }
​
        function updateMaterialDensitySlider(value) {
            materialDensity = parseFloat(value);
            document.getElementById('materialDensityValue').textContent = materialDensity.toFixed(2);
            calculateNeutronCaptureRate();
            calculateDegradation();
            updateNeutronChart(neutronCaptureRate);
            updateNeutronHeatmap([
                { x: boronConcentration, y: gadoliniumConcentration, v: neutronCaptureRate },
                { x: boronConcentration, y: lithiumConcentration, v: neutronCaptureRate },
                { x: gadoliniumConcentration, y: lithiumConcentration, v: neutronCaptureRate }
            ]);
        }
​
        function updateBoronSlider(value) {
            boronConcentration = parseFloat(value);
            document.getElementById('boronValue').textContent = boronConcentration;
            calculateNeutronCaptureRate();
            calculateDegradation();
            updateNeutronChart(neutronCaptureRate);
            updateNeutronHeatmap([
                { x: boronConcentration, y: gadoliniumConcentration, v: neutronCaptureRate },
                { x: boronConcentration, y: lithiumConcentration, v: neutronCaptureRate },
                { x: gadoliniumConcentration, y: lithiumConcentration, v: neutronCaptureRate }
            ]);
        }
​
        function updateGadoliniumSlider(value) {
            gadoliniumConcentration = parseFloat(value);
            document.getElementById('gadoliniumValue').textContent = gadoliniumConcentration;
            calculateNeutronCaptureRate();
            calculateDegradation();
            updateNeutronChart(neutronCaptureRate);
            updateNeutronHeatmap([
                { x: boronConcentration, y: gadoliniumConcentration, v: neutronCaptureRate },
                { x: boronConcentration, y: lithiumConcentration, v: neutronCaptureRate },
                { x: gadoliniumConcentration, y: lithiumConcentration, v: neutronCaptureRate }
            ]);
        }
​
        function updateLithiumSlider(value) {
            lithiumConcentration = parseFloat(value);
            document.getElementById('lithiumValue').textContent = lithiumConcentration;
            calculateNeutronCaptureRate();
            calculateDegradation();
            updateNeutronChart(neutronCaptureRate);
            updateNeutronHeatmap([
                { x: boronConcentration, y: gadoliniumConcentration, v: neutronCaptureRate },
                { x: boronConcentration, y: lithiumConcentration, v: neutronCaptureRate },
                { x: gadoliniumConcentration, y: lithiumConcentration, v: neutronCaptureRate }
            ]);
        }
​
        function calculateNeutronCaptureRate() {
            const avogadroNumber = 6.022e23;
            const atomicMass = 235;
            const numberDensity = (materialDensity * avogadroNumber) / atomicMass;
​
            const macroscopicCrossSection = numberDensity * neutronCrossSection * 1e-24;
            neutronCaptureRate = macroscopicCrossSection * neutronFlux;
​
            document.getElementById('neutronCaptureRate').textContent = neutronCaptureRate.toExponential(2);
        }
​
        function calculateDegradation() {
            const degradationRate = 0.01 * neutronCaptureRate;
            materialIntegrity -= degradationRate;
​
            if (materialIntegrity < 0) {
                materialIntegrity = 0;
            }
​
            document.getElementById('materialIntegrity').textContent = materialIntegrity.toFixed(2) + "%";
        }
​
        function startNeutronSimulation() {
            stopNeutronSimulation();
            neutronSimulationInterval = setInterval(() => {
                calculateNeutronCaptureRate();
                calculateDegradation();
                updateNeutronChart(neutronCaptureRate);
                updateNeutronHeatmap([
                    { x: boronConcentration, y: gadoliniumConcentration, v: neutronCaptureRate },
                    { x: boronConcentration, y: lithiumConcentration, v: neutronCaptureRate },
                    { x: gadoliniumConcentration, y: lithiumConcentration, v: neutronCaptureRate }
                ]);
            }, 1000);
        }
​
        function stopNeutronSimulation() {
            clearInterval(neutronSimulationInterval);
        }
​
        // Photon Absorption Simulation Functions
        function updateEnergySlider(value) {
            photonEnergy = parseFloat(value);
            document.getElementById('energyValue').textContent = photonEnergy.toFixed(2);
            runPhotonSimulation();
        }
​
        function updateBandgapSlider(value) {
            quantumDotBandgap = parseFloat(value);
            document.getElementById('bandgapValue').textContent = quantumDotBandgap.toFixed(2);
            runPhotonSimulation();
        }
​
        function updateTemperatureSlider(value) {
            coreTemperature = parseFloat(value);
            document.getElementById('temperatureValue').textContent = coreTemperature;
            runPhotonSimulation();
        }
​
        function calculateTemperatureEffectOnBandgap() {
            const alpha = 4.73e-4;
            const beta = 636;
            const zeroTempBandgap = 1.12;
            return zeroTempBandgap - (alpha * coreTemperature ** 2) / (coreTemperature + beta);
        }
​
        function runPhotonSimulation() {
            const tempBandgap = calculateTemperatureEffectOnBandgap();
​
            if (photonEnergy > tempBandgap) {
                absorptionEfficiency = ((photonEnergy - tempBandgap) / photonEnergy) * 100;
                totalEnergyAbsorbed += photonEnergy * 1.60218e-19 * absorptionEfficiency;
            } else {
                absorptionEfficiency = 0;
            }
​
            document.getElementById('absorptionEfficiency').textContent = absorptionEfficiency.toFixed(2);
            document.getElementById('totalEnergyAbsorbed').textContent = totalEnergyAbsorbed.toExponential(2);
​
            updatePhotonChart(absorptionEfficiency);
            updatePhotonPieChart(totalEnergyAbsorbed, photonEnergy * 1.60218e-19 - totalEnergyAbsorbed);
            updatePhotonHistogram({
                labels: ['1 eV', '2 eV', '3 eV', '4 eV', '5 eV'],
                values: [10, 20, 30, 40, 50]
            });
        }
​
        function startPhotonSimulation() {
            stopPhotonSimulation();
            photonSimulationInterval = setInterval(runPhotonSimulation, 1000);
        }
​
        function stopPhotonSimulation() {
            clearInterval(photonSimulationInterval);
        }
​
        // Gamma Photon Attenuation Functions
        function updateIntensitySlider(value) {
            intensity = parseFloat(value);
            document.getElementById('intensityValue').textContent = value;
            calculateAttenuation();
        }
​
        function updateMuSlider(value) {
            mu = parseFloat(value);
            document.getElementById('muValue').textContent = value;
            calculateAttenuation();
        }
​
        function updateThicknessSlider(value) {
            thickness = parseFloat(value);
            document.getElementById('thicknessValue').textContent = value;
            calculateAttenuation();
        }
​
        function startGammaSimulation() {
            stopGammaSimulation();
            gammaSimulationInterval = setInterval(calculateAttenuation, 1000);
        }
​
        function stopGammaSimulation() {
            clearInterval(gammaSimulationInterval);
        }
​
        function calculateAttenuation() {
            const finalIntensity = intensity * Math.exp(-mu * thickness);
            document.getElementById('attenuationResult').textContent = finalIntensity.toFixed(2);
            updateGammaChart(finalIntensity);
        }
​
        function updateGammaChart(finalIntensity) {
            if (gammaChart) {
                gammaChart.destroy();
            }
            const ctx = document.getElementById('gammaChart').getContext('2d');
            gammaChart = new Chart(ctx, {
                type: 'bar',
                data: {
                    labels: ['Initial Intensity', 'Final Intensity'],
                    datasets: [{
                        label: 'Intensity (I)',
                        data: [intensity, finalIntensity],
                        backgroundColor: ['#007aff', '#ff5733']
                    }]
                },
                options: {
                    scales: {
                        y: {
                            beginAtZero: true
                        }
                    }
                }
            });
        }
​
        // Compton Scattering Functions
        function updatePhotonEnergySlider(value) {
            photonEnergy = parseFloat(value);
            document.getElementById('photonEnergyValue').textContent = value;
            calculateScattering();
        }
​
        function updateAngleSlider(value) {
            angle = parseFloat(value);
            document.getElementById('angleValue').textContent = value;
            calculateScattering();
        }
​
        function startComptonSimulation() {
            stopComptonSimulation();
            comptonSimulationInterval = setInterval(simulateComptonScatter, 500); // Simulate every 0.5 seconds
        }
​
        function stopComptonSimulation() {
            clearInterval(comptonSimulationInterval);
        }
​
        function calculateScattering() {
            const theta = angle;
            const E = photonEnergy * 1000; // Convert keV to eV
            const radTheta = theta * Math.PI / 180; // Convert degrees to radians
            const me_c2 = 511e3; // Electron rest mass energy in eV
            const scatteredEnergy = E / (1 + (E / me_c2) * (1 - Math.cos(radTheta)));
​
            document.getElementById('scatteredEnergyResult').textContent = (scatteredEnergy / 1000).toFixed(2); // Display in keV
            updateComptonChart(theta, scatteredEnergy / 1000, true); // Recalculate with new inputs and change color
        }
​
        function simulateComptonScatter() {
            const theta = Math.random() * 180; // Random angle between 0 and 180 degrees
            const E = photonEnergy * 1000; // Convert keV to eV
            const radTheta = theta * Math.PI / 180; // Convert degrees to radians
            const me_c2 = 511e3; // Electron rest mass energy in eV
            const scatteredEnergy = E / (1 + (E / me_c2) * (1 - Math.cos(radTheta)));
​
            document.getElementById('scatteredEnergyResult').textContent = (scatteredEnergy / 1000).toFixed(2); // Display in keV
            updateComptonChart(theta, scatteredEnergy / 1000, false);
        }
​
        function updateComptonChart(scatterAngle, scatteredEnergy, changeColor) {
            if (!comptonChart) {
                const ctx = document.getElementById('comptonChart').getContext('2d');
                comptonChart = new Chart(ctx, {
                    type: 'scatter',
                    data: {
                        datasets: [{
                            label: 'Photon Energy vs Scattering',
                            data: [],
                            backgroundColor: '#007aff'
                        }]
                    },
                    options: {
                        scales: {
                            x: {
                                type: 'linear',
                                position: 'bottom',
                                title: {
                                    display: true,
                                    text: 'Scattering Angle (degrees)'
                                },
                                min: 0,
                                max: 180
                            },
                            y: {
                                beginAtZero: true,
                                title: {
                                    display: true,
                                    text: 'Energy (keV)'
                                }
                            }
                        }
                    }
                });
            }
            const newColor = changeColor ? '#ff5733' : '#007aff'; // Change color if user updates slider
            comptonChart.data.datasets[0].backgroundColor = newColor;
            comptonChart.data.datasets[0].data.push({ x: scatterAngle, y: scatteredEnergy });
            comptonChart.update();
        }
​
        // Charts Setup
        const neutronCtx = document.getElementById('neutronChart').getContext('2d');
        const neutronChartData = { labels: [], datasets: [{ label: 'Neutron Capture Rate (reactions/s)', borderColor: '#007aff', data: [] }] };
        const neutronChart = new Chart(neutronCtx, { type: 'line', data: neutronChartData });
​
        function updateNeutronChart(captureRate) {
            neutronChartData.labels.push(neutronChartData.labels.length);
            neutronChartData.datasets[0].data.push(captureRate);
            neutronChart.update();
        }
​
        const photonCtx = document.getElementById('photonChart').getContext('2d');
        const photonChartData = { labels: [], datasets: [{ label: 'Absorption Efficiency (%)', borderColor: '#ff5733', data: [] }] };
        const photonChart = new Chart(photonCtx, { type: 'line', data: photonChartData });
​
        function updatePhotonChart(efficiency) {
            photonChartData.labels.push(photonChartData.labels.length);
            photonChartData.datasets[0].data.push(efficiency);
            photonChart.update();
        }
​
        // Neutron Heatmap
        let neutronHeatmapChart;
        function updateNeutronHeatmap(data) {
            const ctx = document.getElementById('neutronHeatmap').getContext('2d');
            if (neutronHeatmapChart) {
                neutronHeatmapChart.destroy();
            }
            neutronHeatmapChart = new Chart(ctx, {
                type: 'heatmap',
                data: {
                    labels: ['Boron-10', 'Gadolinium-157', 'Lithium-6'],
                    datasets: [{
                        label: 'Neutron Capture Rate',
                        data: data,
                        backgroundColor: 'rgba(0, 122, 255, 0.5)'
                    }]
                },
                options: {
                    scales: {
                        x: { beginAtZero: true },
                        y: { beginAtZero: true }
                    }
                }
            });
        }
​
        // Photon Pie Chart
        let photonPieChart;
        function updatePhotonPieChart(absorbed, notAbsorbed) {
            const ctx = document.getElementById('photonPieChart').getContext('2d');
            if (photonPieChart) {
                photonPieChart.destroy();
            }
            photonPieChart = new Chart(ctx, {
                type: 'pie',
                data: {
                    labels: ['Absorbed', 'Not Absorbed'],
                    datasets: [{
                        data: [absorbed, notAbsorbed],
                        backgroundColor: ['#ff5733', '#007aff']
                    }]
                },
                options: {
                    responsive: true
                }
            });
        }
​
        // Photon Histogram
        let photonHistogramChart;
        function updatePhotonHistogram(data) {
            const ctx = document.getElementById('photonHistogram').getContext('2d');
            if (photonHistogramChart) {
                photonHistogramChart.destroy();
            }
            photonHistogramChart = new Chart(ctx, {
                type: 'bar',
                data: {
                    labels: data.labels,
                    datasets: [{
                        label: 'Absorption Efficiency (%)',
                        data: data.values,
                        backgroundColor: '#ff5733'
                    }]
                },
                options: {
                    scales: {
                        x: { beginAtZero: true },
                        y: { beginAtZero: true }
                    }
                }
            });
        }
​
        // Example data for heatmap, pie chart, and histogram
        const neutronHeatmapData = [
            { x: 0, y: 0, v: 10 },
            { x: 1, y: 1, v: 20 },
            { x: 2, y: 2, v: 30 }
        ];
        updateNeutronHeatmap(neutronHeatmapData);
​
        const absorbed = 70;
        const notAbsorbed = 30;
        updatePhotonPieChart(absorbed, notAbsorbed);
​
        const photonHistogramData = {
            labels: ['1 eV', '2 eV', '3 eV', '4 eV', '5 eV'],
            values: [10, 20, 30, 40, 50]
        };
        updatePhotonHistogram(photonHistogramData);
    </script>
</body>
</html>
                

Running the Project

To run the simulation:

Download the full HTML file.
Open it in any web browser.
Adjust the simulation sliders and see how the graphs update in real-time based on your input.