Для заказчика требовалось решить задачу "Flat Lay" на JavaScript автоматического размещения картинок в заданных рамках максимально плотно.
Краткое описание:
Сервер разработан на Go с использованием JavaScript и HTML.
При изменении размеров окна автоматически генерируется коллаж Flat Lay для указанного окна с подбором картинок, формирующим максимально плотное заполнение в указанной рамке.
Алгоритм:
1. Скрипт при загрузки страницы либо изменении номера группы узнает
количество возможных групп (страниц для ленты) и выводити данное значение на экран.
URL
запроса к серверу "/get_total_groups"
2. Далее скрипт отсылает
размеры рамки, куда нужно вписать коллаж и номер группы, из которой
выбирать картинки. URL: "/get_field?group=G&width=W&height=H"
Ответ: JSON массив картинок с их координатами.
3. Далее скрипт размещает картинки по заданным координатам внутри рамки.
Детали:
Задача имеет NP-полноту, в связи с чем имеется ограничение по времени в 1 секунду на поиск решения. Отображается наилучшее решение среди найденных в течении 1 секунды поиска.
При снятии ограничения по времени отображается идеальное же решение среди всех возможных.
При количестве картинок в группе меньше 20 сервер может сформировать решение за 1 секунду. При больших значениях базы, решение занимает кубическое время от объема данных.
Сервер может выдавать коллажи параллельно нескольким пользователям с минимальным потреблением памяти.
Ввод данных: HTTP GET
Вывод данных: JSON
Клиентская часть написана минималистично на JS, что снимает нагрузку с клиента.
Исходники решения доступны по адресу
https://github.com/MasterDimmy/FlatLay