Масштабируемая обтравочная маска

Question

Мне нужно разрезать переменные изображения на кусочки в форме головоломки, например, (не квадраты): http://www.fernando.com.ar/jquery-puzzle/

Я рассмотрел возможность сделать это с php-библиотекой, такой как Cairo или GD, но практически не имел опыта работы с этими библиотеками и не вижу непосредственного решения для создания обтравочной маски, динамически масштабируемой для изображений разного размера.

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

Answer 1

Если вы решите сделать это, используя PHP с GD, то здесь может помочь код:

http://php.amnuts.com/index.php?do=view&id=15&file=class.imagemask.php

По сути, вам нужно начать с GD с маски определенного размера, а затем использовать функцию imagecopyresampled, чтобы скопировать ресурс изображения маски в больший или меньший размер. Чтобы понять, что я имею в виду, ознакомьтесь с классом метода _getMaskImage, показанным по ссылке выше. Рабочий пример вывода можно увидеть по адресу:

http://php.amnuts.com/demos/image-mask/

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

Answer 2

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

Затем вы можете просто динамически окрашивать каждую часть фрагмента, который вы хотите удалить, с помощью определенного цвета (например,# 0f0) и затем используйте imagecolorallocatealpha, чтобы сделать этот цвет прозрачным.Сделайте это для каждой части, и у вас будут свои части изображения на стороне сервера.

Однако, если бы я был там, я бы заранее создал обтравочную маску каждой головоломки в отдельном цвете.Это сделало бы два изображения для каждого соединения (одно с торчащим круглым соединителем, а другое - с круглым).Таким образом, вы можете просто скопировать эти маски на изображение, чтобы быстро создать красивые края.

Answer 3

GD довольно сложный, я слышал очень хорошие вещи об Image Magick, для которого есть версия PHP и много документации на php.net.Однако не на всех веб-серверах это будет установлено по умолчанию.

http://www.php.net/manual/en/book.imagick.php