Русский

Изображения и фотографии · Изменение размера изображений в социальных сетях

Объяснение фильтров передискретизации: ближайшего, билинейного, бикубического и Ланцоша

· Фон

изменение размера изображения передискретизация холст

Диаграммы именованных фильтров заканчиваются полем браузера, отмеченным только подсказками по сглаживанию и качеству.
Оригинальная векторная иллюстрация ToolAcre

При каждом изменении размера необходимо решить, какого цвета должен быть новый пиксель по сравнению со старыми: копии ближайших соседей, билинейные средние — четыре, бикубические — шестнадцать, а Ланцос использует оконный синк. В этом посте объясняется каждый из них: компромисс между размытием, звоном и псевдонимами, а также то, что вам дают браузеры.

Одна и та же фотография, три инструмента, три результата — конкретная головоломка из изображений измененного размера, отличающихся резкостью и мерцанием.

Два инструмента изменения размера могут создавать файлы с одинаковыми размерами и заметно разными краями. Геометрия может совпадать, тогда как выборка различается: каждому выходному пикселю нужен цвет, полученный из исходной информации, и этот вывод может способствовать резкости, плавности или устойчивости к сглаживанию. Сами по себе размеры файла не могут идентифицировать метод.

Social Image Resizer намеренно дает более узкие обещания. Перед drawImage он включает сглаживание изображения и требует высокого качества сглаживания. Canvas 2D API не сообщает приложению, какое именно ядро ​​выбирает браузер, поэтому продукт не может пометить свой вывод как ближайший, билинейный, бикубический или Ланцоша с уверенностью на уровне исходного кода.

Проблема выборки: почему сжатие изображения без фильтрации приводит к муару и неровным краям, проще говоря

При сжатии удаляются образцы. Если высокочастотные полосы, волосы или сетка отображаются без соответствующей фильтрации, они могут стать неровными, мерцать или образовывать ложные узоры. Увеличение создает новые позиции выборки между существующими. В обоих направлениях ресэмплер оценивает выходные данные из конечного источника, а не раскрывает скрытые детали.

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

Ближайший и билинейный — полезные понятия, но ToolAcre не предоставляет их в качестве выбора.

Метод «ближайший сосед» концептуально выбирает ближайший исходный образец и стремится сохранить блоки жестких пикселей. Билинейная интерполяция концептуально смешивает близлежащие выборки и в целом сглаживает переходы. Эти описания помогают объяснить видимые крайности, но ToolAcre не предлагает переключателя, помеченного каким-либо методом, и его тесты не идентифицируют ядро ​​движка.

Не выводите именованный фильтр только по одному краю. Реализация браузера может оптимизировать или изменять поведение в зависимости от масштаба. Единственное достоверное заявление о продукте — это то, что сглаживание включено и свойство качества установлено на высокое значение. Любая более глубокая классификация требует наличия доказательств, специфичных для браузера, за пределами этого модуля.

Бикубическое поведение не обещано этой реализацией холста.

Бикубические методы используют более широкую окрестность и кубическое взвешивание с вариантами, в которых мягкость отличается от превышения края. Это ценный фон для сравнения специализированных приложений для работы с изображениями. Это не контракт на вывод Canvas 2D, поскольку render.js не выбирает кубические коэффициенты и не импортирует бикубическую библиотеку.

Если производственный рабочий процесс требует определенного кубического ядра, используйте инструмент, который дает ему имя и тестирует. Social Image Resizer отдает приоритет доступности встроенного браузера и локальной работе. Его результат следует оценивать как результат повторной выборки браузера в соответствии с записанным движком и версией, а не как контролируемую научную реализацию одного варианта.

Lanczos находится вне контракта на инструмент и не заявлен как дефолтный

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

Это упущение имеет значение при диагностике ореолов. Видение одного из них не доказывает наличие ядра Ланцоша, а отсутствие его не доказывает наличие другого алгоритма. Сравнивайте источник и результат, масштаб документа и браузер и избегайте назначения причин, которые приложение не может обнаружить. Визуальный симптом может помочь при тестировании без сертификации скрытого кода.

Что предлагают браузеры — переключатели сглаживания и подсказки по качеству, а не именованные фильтры, и почему выходные данные различаются в зависимости от браузера и версии.

Холст браузера предоставляет imageSmoothingEnabled и imageSmoothingQuality, а не каталог фильтров. ToolAcre устанавливает первое истинное значение и второе максимальное значение непосредственно перед рисованием масштабированного источника. Движки могут интерпретировать подсказку по-разному или изменяться в зависимости от версии, поэтому идентичный JavaScript может привести к небольшим различиям между браузерами.

Геометрия остается явной, даже если выборка не выполняется. ComputeFrame возвращает точный масштаб и размеры чертежа; drawRect центрирует и смещает результат; выходной холст имеет целочисленные целевые размеры. Отделяйте эти известные факты от скрытой выборки при рассмотрении различий между браузерами.

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

Повышение резкости после изменения размера, методы с учетом содержимого и реконструкция машинного обучения отсутствуют. Здесь нет управления нерезкой маской, детектора краев или модели сгенерированной детализации. Элементы управления качеством вывода влияют на кодирование форматов с потерями, а не на этап повышения резкости после изменения размера. Рассматривайте их как отдельные операции.

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

Вывод: фильтр объясняет внешний вид — Social Image Resizer использует собственную передискретизацию браузера, поэтому знание этих терминов подскажет вам, чего ожидать и что проверять.

Повторная выборка объясняет, почему размер — это еще не все, но доказательства должны соответствовать инструменту. Social Image Resizer запрашивает сглаженный, высококачественный рисунок на холсте и оставляет браузеру точное ядро. Этого достаточно, чтобы производить полезные культуры без использования фильтра, который код никогда не выбирает.

Сохраняйте сложное тестовое изображение, записывайте сведения о браузере и сравнивайте результаты экспорта, когда качество имеет значение. Терминология помогает описать то, что вы видите; реализация говорит вам, что вы можете честно утверждать. Именованные алгоритмы применимы только в том случае, если их подтверждает код или авторитетные данные браузера.