избежать массового использования памяти в openlayers с наложением изображения

Question

Я строю картографическую систему, которая требует наложения большого изображения (собственные 13K пикселей в ширину и 20K пикселей в высоту) на область США, охватывающую около 20 километров или около того.У меня размер файла изображения в формате jpg до 23 МБ, и он загружается на карту довольно быстро.Я могу увеличивать и уменьшать масштаб, и это выглядит великолепно.Он даже расположен именно там, где мне нужно (географически).Тем не менее, этот файл размером 25 МБ заставляет Firefox использовать дополнительно 1 ГБ памяти !!!Я использую расширение Memory Restart в Firefox и без наложения изображений, использование памяти составляет от 360 МБ до 400 МБ, что, по-видимому, является нормой для обычного использования, просмотра других сайтов и т. Д.использование памяти увеличивается до 1,4 ГБ.Я совершенно не могу объяснить, ПОЧЕМУ это и как это исправить.Любые идеи будут с благодарностью.

Андрей

Answer 1

Файл занимает только 23 МБ в формате JPEG. Однако формат JPEG является сжатым, и любая программа (например, FireFox), которая хочет фактически визуализировать изображение, должна распаковывать его и сохранять каждый пиксель в памяти. У вас есть 13k на 20k пикселей, что составляет 260 миллионов пикселей. Нарисуйте минимум 3 байта цветовой информации на пиксель, это 780 МБ. Может потребоваться 4 байта для выравнивания каждого пикселя по границе слова, что составляет 1040 МБ.

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

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

Редактировать: прояснить этот последний бит: сейчас у вас есть вся фотография в полном разрешении, которая проста, но требует много памяти. Альтернативой будет иметь всю фотографию с уменьшенным разрешением (максимальное ожидаемое разрешение экрана), что займет меньше памяти; затем, когда пользователь увеличивает масштаб изображения, вы получаете изображение с полным разрешением, но не все изображение - только ту часть, которая была увеличена (для которой также требуется меньше памяти).

Я могу придумать два подхода: разбить большое изображение на «плитки» и загрузить те, которые вам нужны (не уверен, насколько хорошо это будет работать), или использовать что-то вроде ImageMagick для создания меньшего изображения на лету , Возможно, вы захотите использовать кэширование, если вы делаете это таким образом, и вам может понадобиться написать небольшое сообщение «Пожалуйста, подождите», которое будет отображаться во время его создания, поскольку обработка такого большого изображения может занять несколько секунд.