fix(geo): AOI map blank — hardcode height 520px, decouple от flex/vh
Console показывает no errors AND no tile requests. Это значит L.map(div) либо не вызывается, либо вызывается с 0×0 контейнером (Leaflet не запрашивает 0 tiles при 0-viewport). Гипотеза: 'flex-1' + 'height: 60vh' конфликтуют с Modal transform animation (translate-y-2 scale-[0.98] во время fade-in). На момент useEffect div.clientHeight иногда читался 0 несмотря на inline style. Decouple полностью: hardcode '520px' pixel height, display:block, width:100%. Не использует flex layout. Стабильно >0 на любом viewport.
This commit is contained in:
@@ -180,11 +180,12 @@ export const AoiPickerDialog = ({ isOpen, onClose, onApply, initial }: Props) =>
|
||||
|
||||
<div
|
||||
ref={mapDivRef}
|
||||
className="flex-1 rounded-sm border border-regolith"
|
||||
// Inline height — Leaflet требует non-zero containerSize в момент
|
||||
// L.map() create(). flex-1 не гарантирует высоту до layout pass;
|
||||
// explicit 420px минимум защищает от blank карты.
|
||||
style={{ minHeight: 420, height: '60vh' }}
|
||||
className="rounded-sm border border-regolith"
|
||||
// Hardcoded pixel height + block display — full decoupling от flex/vh.
|
||||
// Leaflet требует non-zero containerSize в момент L.map() create().
|
||||
// 60vh раньше иногда читался как 0 во время Modal transform animation;
|
||||
// 520px стабильно.
|
||||
style={{ display: 'block', width: '100%', height: 520 }}
|
||||
aria-label={t('aoi.dialog.mapAriaLabel')}
|
||||
/>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user