Создание мэп-карты в GIMP
Статья предоставлена форумом http://onepiecenewgen.rolka.su
Автор - Eri

На ForumDesign TS уже есть описание процесса создания мэп-карты, с которым можно ознакомиться здесь. Этот же урок рассчитан на пользователей GIMP’а.

1. Откройте в GIMP готовую картинку с уже наложенными надписями (заказать можно здесь)

http://uploads.ru/t/h/b/7/hb7GO.jpg


2. Далее выберите в меню пункт «Фильтры» > «Веб» > «Карта изображения»

http://uploads.ru/t/z/8/p/z8pa1.jpg

Откроется окно создания мэп-карты.

http://uploads.ru/t/k/P/6/kP6FH.png

Рассмотрим окно поподробнее. Кнопка с лупой позволит нам увеличить изображение, если понадобится более точное выделение небольшой области. Кнопки слева от изображения регулируют форму области выделения – прямоугольник, круг и многоугольник.

Для моей карты больше подойдет прямоугольный вариант, поэтому я выбрала первый режим.

3. Увеличим изображение и приступим непосредственно к выделению областей-ссылок.

http://uploads.ru/t/l/t/T/ltTp3.jpg

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

http://uploads.ru/t/w/h/4/wh4sE.jpg
http://uploads.ru/t/W/b/Q/WbQTN.jpg

4. Повторим действие для следующей ссылки.

http://uploads.ru/t/0/s/O/0sOV9.jpg

И так до тех пор, пока все нужные области-ссылки не будут созданы. Справа мы видим список ссылок, которые, при желании, сможет отредактировать.

http://uploads.ru/t/8/h/B/8hBJj.jpg

5. Остается лишь сохранить нашу карту в нужную папку в расширении .map

6. Далее открываем получившийся файл через блокнот и копируем получившийся код.

<img src="map.png" width="400" height="250" border="0" usemap="#map" />
<map name="map">
<!-- #$-:Image map file created by GIMP Image Map plug-in -->
<!-- #$-:GIMP Image Map plug-in by Maurits Rijk -->
<!-- #$-:Please do not edit lines starting with "#$" -->
<!-- #$VERSION:2.3 -->
<!-- #$AUTHOR: Eri-->

<area shape="rect" coords="51,88,162,115" href="https://forumd.ru/viewforum.php?id=86" />
<area shape="rect" coords="50,115,211,144" href="https://forumd.ru/viewforum.php?id=69" />
<area shape="rect" coords="50,145,152,171" href="https://forumd.ru/viewforum.php?id=70" />
<area shape="rect" coords="84,124,158,140"  nohref="nohref" />
</map>

Выделенную курсивом часть кода можно спокойно удалить.

7. Карта закончена, получившийся код вы можете вставить в объявление или любое другое нужное вам место, где работает html.

Теги: урок, gimp, мэп-карта