https://sasan.jafarnejad.io/tag/map/MapHugo Blox Builder (https://hugoblox.com)en-usSun, 19 Jan 2025 12:00:00 +0100https://sasan.jafarnejad.io/project/luxembourg-population-visualization/Sun, 19 Jan 2025 12:00:00 +0100https://sasan.jafarnejad.io/project/luxembourg-population-visualization/<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin=""/> <link rel="stylesheet" href="https://sasan.jafarnejad.io/css/nationality-map.css"> <div class="nationality-map-container"> <div class="container"> <div class="header"> <div class="controls"> <div class="control-group"> <label for="filter-type">Color by:</label> <select id="filter-type"> <option value="none">No coloring</option> <option value="nationality">Nationality</option> <option value="region">Region</option> </select> <select id="filter-value" disabled> <option value="">Select filter</option> </select> <select id="metric-type"> <option value="proportion">Proportion (%)</option> <option value="absolute">Absolute Numbers</option> </select> </div> <select id="language-selector"> <option value="en">English</option> <option value="fr">Français</option> <option value="de">Deutsch</option> <option value="pt">Português</option> </select> </div> </div> <div class="dashboard"> <div id="luxmap"></div> <div id="details-panel"> <h2 id="details-title">Commune Details</h2> <div id="commune-name"></div> <div id="nationality-stats"> <div class="stat-group"> <h3 id="region-title">Population by Region</h3> <div id="region-stats"></div> </div> <div class="stat-group"> <h3 id="nationalities-title">All Nationalities</h3> <div id="nationality-list"></div> </div> </div> </div> </div> </div> </div> <script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js" integrity="sha256-20nQCchB9co0qIjJZRGuk2/Z9VM+kNiyxNV1lvTlZBo=" crossorigin=""></script> <script src="https://sasan.jafarnejad.io/js/nationality-map/languages.js"></script> <script src="https://sasan.jafarnejad.io/js/nationality-map/nationalityData.js"></script> <script src="https://sasan.jafarnejad.io/js/nationality-map/map.js"></script> <p>Data sources:</p> <ul> <li>Population data: <a href="https://data.public.lu/en/datasets/registre-national-des-personnes-physiques-rnpp-nombre-de-ressortissants-par-nationalite-et-par-commune-number-of-citizens-per-nationality-and-municipality/" target="_blank" rel="noopener">RNPP - Number of citizens per nationality and municipality</a></li> <li>Geographic data: <a href="https://data.public.lu/en/datasets/limites-administratives-du-grand-duche-de-luxembourg/" target="_blank" rel="noopener">Administrative boundaries of the Grand Duchy of Luxembourg</a></li> </ul> <p>Questions or feedback? <a href="https://sasan.jafarnejad.io/#contact" target="_blank" rel="noopener">Contact me</a></p>