Use fixed aspect ratio scaling

This commit is contained in:
2026-02-05 16:21:14 +01:00
parent b651e71276
commit d31650131b

40
ui.R
View File

@@ -38,6 +38,20 @@ ui <- function() {
/* 1. GRUND-LAYOUT */ /* 1. GRUND-LAYOUT */
body { body {
background-color: #f4f7f9 !important; /* Ganz leichtes Blaugrau für Tiefe */ background-color: #f4f7f9 !important; /* Ganz leichtes Blaugrau für Tiefe */
transform-origin: 0 0; /* Align to top-left for math accuracy */
width: 1920px; /* Match your dev monitor */
height: 1080px;
overflow: hidden;
position: absolute;
}
.shiny-plot-output {
width: inherit !important;
height: inherit !important;
max-width: none !important;
}
#app-container {
width: 1920px;
height: 1080px;
} }
/* 2. DIE KARTE (HHMAP) */ /* 2. DIE KARTE (HHMAP) */
#hhmap { #hhmap {
@@ -159,6 +173,32 @@ ui <- function() {
") ")
) )
), ),
tags$script(HTML("
$(document).on('shiny:connected', function() {
var targetWidth = 1920;
var targetHeight = 1080;
function scaleApp() {
var windowWidth = $(window).width();
var windowHeight = $(window).height();
// Calculate both ratios
var widthRatio = windowWidth / targetWidth;
var heightRatio = windowHeight / targetHeight;
// Use the smaller ratio to ensure the app fits entirely
var scale = Math.min(widthRatio, heightRatio);
$('body').css({
'transform': 'scale(' + scale + ')',
'width': targetWidth + 'px',
'height': targetHeight + 'px'
});
}
$(window).on('resize', scaleApp);
scaleApp();
});"
)),
navset_card_tab( navset_card_tab(
nav_panel("Karte", nav_panel("Karte",
page_sidebar( page_sidebar(