Размер экрана WEBgl и unity

В PlayerSettings все вроде нормально настраивал под яндекс игры и WEBgl. В Index html и style вроде нормально(в них не разбираюсь)

Проверка разрешения WebGL: В настройках WebGL в Player Settings (первый скриншот) проверь, чтобы было установлено правильное разрешение канваса (в твоём случае оно выставлено на 1920x1080). Если игра должна подстраиваться под размер окна браузера, можно попробовать установить Canvas Width и Height на Auto, чтобы Unity автоматически подстраивала разрешение.

Настройки CSS для HTML и канваса: На скриншотах CSS-кода видно, что используется height: 100% и width: 100% для html, body, и контейнера канваса (#unity-container и #unity-canvas). Это должно растянуть канвас на весь экран, но иногда могут быть проблемы с адаптацией размеров, особенно в различных браузерах.

Отключение масштабирования страницы: В HTML-коде (в теге <meta>) можно попробовать добавить:

html
Копировать код
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
Это может помочь избежать ненужного масштабирования или изменения размера страницы при загрузке.

Проверка значений CSS для overflow: На втором скриншоте в CSS указано overflow: hidden;. Это может помочь избежать прокрутки, но также может создавать проблемы с масштабированием на некоторых устройствах и разрешениях экрана. Попробуй временно отключить overflow: hidden; и посмотри, изменится ли поведение.

Проверка параметра "Resolution Scaling" в настройках WebGL (Player Settings > Resolution and Presentation): Убедись, что флаг "Resolution Scaling" отключен или установлен на фиксированное значение, если ты не хочешь, чтобы игра меняла разрешение в зависимости от устройства.

Canvas Resizing: Убедись, что в коде самой игры используется CanvasScaler (если это UI), настроенный на "Scale with Screen Size", и установлены базовые параметры для разрешения (например, 1920x1080).

Если эти советы не решат проблему, можно попробовать запустить игру в другом браузере, чтобы проверить, возможно ли это специфическая проблема конкретного браузера или настроек Яндекс Игр. Также может помочь консоль разработчика в браузере для отслеживания ошибок, связанных с CSS или JavaScript.

2. Настройка Resize Observer в JavaScript:
Поскольку CSS может не всегда корректно обновлять размеры канваса при изменении размеров окна браузера, попробуй добавить код на JavaScript для отслеживания изменения размеров окна и автоматической подстройки канваса.

В index.html добавь следующий скрипт в блок <script>:

javascript
Копировать код
window.addEventListener('resize', resizeCanvas);

function resizeCanvas() {
const canvas = document.getElementById('unity-canvas');
canvas.style .width = window.innerWidth + 'px';
canvas.style .height = window.innerHeight + 'px';
}

// Вызов функции сразу после загрузки страницы
resizeCanvas();

Использование devicePixelRatio:
В некоторых случаях проблема связана с различными значениями плотности пикселей (особенно на устройствах с высокой плотностью пикселей, как Retina-дисплеи). Попробуй настроить канвас с учётом этого коэффициента:

javascript
Копировать код
function adjustCanvasForPixelRatio() {
const canvas = document.getElementById('unity-canvas');
const pixelRatio = window.devicePixelRatio || 1;
canvas.width = window.innerWidth * pixelRatio;
canvas.height = window.innerHeight * pixelRatio;
canvas.style .width = window.innerWidth + 'px';
canvas.style .height = window.innerHeight + 'px';
}

window.addEventListener('resize', adjustCanvasForPixelRatio);
adjustCanvasForPixelRatio();

Проверка установок WebGL Template:
В Unity можно использовать шаблоны для WebGL. На первом скриншоте видно, что у тебя установлен шаблон Default. Попробуй переключиться на шаблон Minimal или Custom и внеси нужные изменения вручную.

Minimal template может работать лучше, так как он меньше перегружен стилями.
Если используешь кастомный шаблон, можешь скопировать index.html из стандартного шаблона и удалить избыточные стили и скрипты, чтобы оставить только основные параметры для отображения канваса.

Дополнительный JavaScript для поддержки адаптивности:
Если указанные шаги не помогают, можно использовать более сложные настройки адаптивного JavaScript для динамического управления канвасом. Например:

javascript
Копировать код
function setupResponsiveCanvas() {
const canvasContainer = document.getElementById('unity-container');
const canvas = document.getElementById('unity-canvas');

function resize() {
let width = window.innerWidth;
let height = window.innerHeight;

canvasContainer.style .width = `${width}px`;
canvasContainer.style .height = `${height}px`;

canvas.width = width;
canvas.height = height;
}

window.addEventListener('resize', resize);
resize();
}

setupResponsiveCanvas();

Upd: в Style css