Spaces:
Running
Running
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Political Speech Semantic Map Gallery</title> | |
| <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;700&display=swap" rel="stylesheet"> | |
| <link rel="stylesheet" href="style.css"> | |
| </head> | |
| <body> | |
| <header> | |
| <h1>Political Speech Semantic Map Gallery</h1> | |
| <p class="subtitle">Explore visual topic modeling of political speeches</p> | |
| </header> | |
| <div class="container"> | |
| <div class="gallery"> | |
| <div class="map-item"> | |
| <div class="map-preview"> | |
| <iframe src="trump_speeches.html"></iframe> | |
| <div class="map-overlay"> | |
| <a href="#" class="view-button" data-map="trump_speeches.html">View Map</a> | |
| </div> | |
| </div> | |
| <div class="map-info"> | |
| <h2>Trump Speeches Analysis</h2> | |
| <p>Visual topic modeling of Trump's speeches, with metadata about which parts of his speeches discuss each topic.</p> | |
| </div> | |
| </div> | |
| <div class="map-item"> | |
| <div class="map-preview"> | |
| <iframe src="inaugural_speeches_map.html"></iframe> | |
| <div class="map-overlay"> | |
| <a href="#" class="view-button" data-map="inaugural_speeches_map.html">View Map</a> | |
| </div> | |
| </div> | |
| <div class="map-info"> | |
| <h2>US Presidential Inaugural Speeches</h2> | |
| <p>Visual topic modeling of various US presidential inaugural speeches throughout history.</p> | |
| </div> | |
| </div> | |
| <div class="map-item"> | |
| <div class="map-preview"> | |
| <iframe src="inaugural_unity.html"></iframe> | |
| <div class="map-overlay"> | |
| <a href="#" class="view-button" data-map="inaugural_unity.html">View Map</a> | |
| </div> | |
| </div> | |
| <div class="map-info"> | |
| <h2>US Presidential Inaugural Speeches Bourdieu Map</h2> | |
| <p>VTM with unity-division international-domestic axis.</p> | |
| </div> | |
| </div> | |
| <div class="map-item"> | |
| <div class="map-preview"> | |
| <iframe src="topic_analysis_plot.html"></iframe> | |
| <div class="map-overlay"> | |
| <a href="#" class="view-button" data-map="topic_analysis_plot.html">View Plot</a> | |
| </div> | |
| </div> | |
| <div class="map-info"> | |
| <h2>Topic Distribution Analysis</h2> | |
| <p>Comparison of topic distributions between Trump, Republican, and Democratic speeches.</p> | |
| </div> | |
| <div class="stats"> | |
| <p><strong>Chi-square statistic:</strong> 50.52226900766782</p> | |
| <p><strong>p-value:</strong> 1.1307886006522511e-06</p> | |
| <p><strong>Interpretation:</strong> There is a statistically significant difference in topic distribution across political sides.</p> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="mapModal" class="modal"> | |
| <span class="close-modal">×</span> | |
| <div class="modal-content"> | |
| <iframe id="modalIframe" src=""></iframe> | |
| </div> | |
| </div> | |
| <script> | |
| const modal = document.getElementById('mapModal'); | |
| const modalIframe = document.getElementById('modalIframe'); | |
| const viewButtons = document.querySelectorAll('.view-button'); | |
| const closeModal = document.querySelector('.close-modal'); | |
| viewButtons.forEach(button => { | |
| button.addEventListener('click', (e) => { | |
| e.preventDefault(); | |
| const mapSrc = button.getAttribute('data-map'); | |
| modalIframe.src = mapSrc; | |
| modal.style.display = 'block'; | |
| }); | |
| }); | |
| closeModal.addEventListener('click', () => { | |
| modal.style.display = 'none'; | |
| modalIframe.src = ''; | |
| }); | |
| window.addEventListener('click', (e) => { | |
| if (e.target == modal) { | |
| modal.style.display = 'none'; | |
| modalIframe.src = ''; | |
| } | |
| }); | |
| </script> | |
| </body> | |
| </html> |