Как получить физический размер экрана (т.е. В дюймах)?

Я пытаюсь выяснить, как получить физические размеры экрана устройства через Javascript. До сих пор мой вывод состоит в том, что в настоящее время это невозможно, но я надеюсь, что кто-то может доказать мне свою ошибку:).

До сих пор я пытался получить эту информацию, найдя устройство DPI, но похоже, что здесь нет способа получить правильное значение, поскольку все устройства, которые я тестировал (некоторые устройства Android HDPI и XHDPI, iPhone4S, iPad 2 и iPad 3) сообщает 96DPI.

Первый способ получения DPI, который я пробовал, - это тот, который вы можете найти повсюду в Интернете: создайте div с шириной CSS 1in, получите его clientWidth или offsetWidth и там ваш DPI. Не работает, все устройства сообщают 96.

Второй метод использовал разрешение медиа-запроса, что-то вроде строк:

for (var i=90; i < 400; i++) {
    if (matchMedia('(resolution: ' + i + 'dpi)').matches) {
       return i;
    }
}

Я думал, что это разумное решение, но, к сожалению, оно также возвращает 96.

Есть ли что-нибудь, что я могу попробовать?

Ответы

Ответ 1

96 "DPI" - это веб-стандарт, который имеет мало общего с реальностью. Дюймы, которые он измеряет, лучше всего считаются "логическими" дюймами, которые соответствуют метрикам шрифтов и измерениям CSS (которые могут включать точки и дюймы). "Точка" в типографии определяется как 1/72 дюйма, но экраны перестали быть постоянными 72 DPI в давние времена. Таким образом, все точки CSS действительно означают, что шрифт 96 точек имеет высоту 72 пикселя. (И эти логические пиксели, так как проблема теперь еще сложена экранами hi-DPI.)

Во всяком случае, большинство родных операционных систем не знают ничего об их истинном физическом размере экрана, поэтому у них даже нет информации о том, что они могут открывать веб-приложения через браузер. То, что вы просите, невозможно.

Ответ 2

Взгляните на этот пост. Это делается с помощью:

<meta name="viewport" content="width=device-width, target-densitydpi=device-dpi">