Hugging Face's logo

Spaces:
TheGreatUnknown
/
Quantum-Equation-Explorer-LLML
Running

App Files Community
Quantum-Equation-Explorer-LLML
File size: 2,858 Bytes 
36057d5
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
 
// Visualization configurations using Plotly.js
const defaultLayout = {
  paper_bgcolor: 'rgba(0,0,0,0)',
  plot_bgcolor: 'rgba(0,0,0,0)',
  font: {
    color: '#e0e0e0'
  },
  margin: {
    l: 40, r: 20, t: 20, b: 40
  }
};

function initializeVisualizations() {
  // Superposition visualization
  const superpositionData = [{
    y: quantumSystem.state.superposition.states,
    type: 'bar',
    marker: {
      color: '#6f42c1'
    }
  }];
  
  Plotly.newPlot('superposition', superpositionData, {
    ...defaultLayout,
    title: 'Quantum States'
  });

  // Gates visualization
  const gatesData = [{
    type: 'heatmap',
    z: [[1, 0], [0, 1]],
    colorscale: 'Viridis'
  }];

  Plotly.newPlot('gates', gatesData, {
    ...defaultLayout,
    title: 'Gate Operations'
  });

  // Search visualization
  const searchData = [{
    y: [0],
    type: 'scatter',
    mode: 'lines',
    line: {
      color: '#00acc1'
    }
  }];

  Plotly.newPlot('search', searchData, {
    ...defaultLayout,
    title: 'Search Probability'
  });

  // Walk visualization  
  const walkData = [{
    y: [0],
    type: 'scatter',
    mode: 'lines',
    line: {
      color: '#00acc1'
    }
  }];

  Plotly.newPlot('walks', walkData, {
    ...defaultLayout, 
    title: 'Quantum Walk'
  });

  updateStateDisplay();
}

function updateVisualizations() {
  const state = quantumSystem.getState();

  // Update superposition
  Plotly.update('superposition', {
    y: [state.state.superposition.states]
  });

  // Update gates
  const gateMatrix = state.state.gates.hadamard ? 
    [[1/Math.sqrt(2), 1/Math.sqrt(2)], [1/Math.sqrt(2), -1/Math.sqrt(2)]] :
    [[1, 0], [0, Math.exp(state.state.gates.phase)]];
  
  Plotly.update('gates', {
    z: [gateMatrix]
  });

  // Update search
  Plotly.extendTraces('search', {
    y: [[state.state.search.probability]]
  }, [0]);

  // Update walk
  if (state.state.walk.active) {
    Plotly.extendTraces('walks', {
      y: [[state.state.walk.position]]
    }, [0]);
  }

  updateStateDisplay();
}

function updateStateDisplay() {
  const state = quantumSystem.getState();
  
  // Update state display
  document.getElementById('state-display').innerHTML = `
    <pre>
    Superposition: ${state.state.superposition.active ? 'Active' : 'Inactive'}
    Gates: H=${state.state.gates.hadamard}, φ=${state.state.gates.phase.toFixed(2)}
    Search Iterations: ${state.state.search.iterations}
    Walk Position: ${state.state.walk.position.toFixed(2)}
    </pre>
  `;

  // Update metrics
  document.getElementById('metrics').innerHTML = `
    <pre>
    Coherence: ${state.metrics.coherence.toFixed(3)}
    Entanglement: ${state.metrics.entanglement.toFixed(3)}
    Efficiency: ${state.metrics.efficiency.toFixed(3)}
    </pre>
  `;
}

// Initialize visualizations when page loads
window.addEventListener('load', initializeVisualizations);