Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 21.07.2017, 21:46
Аспирант
Отправить личное сообщение для maxg5 Посмотреть профиль Найти все сообщения от maxg5
 
Регистрация: 16.08.2016
Сообщений: 89

Работа с SVG
Всем доброго времени суток!
Нужно установить на сайт JS плагин imagemapster. Вот офф сайт плагина.
Дизайнер отрисовал в программе корел карту в SVG(файл во вложении)
map.zip
Непонятно как теперь этом файл применит к этому JS плагину.
Вся проблема в координатах. Мой SVG файл отрисован в polygon path. а для плагина нужны координаты area coords.
Подскажите как решить проблему пожалуйста.
Ответить с цитированием
  #2 (permalink)  
Старый 21.07.2017, 23:21
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

maxg5,
Непонятно зачем дизайнер сохранил в SVG, если плагин не работает с SVG, пусть дизайнер экспортирует координаты из векторной карты в нужном тебе виде, если не знает как это делается пусть погуглит, например первое попавшееся в гугле решение:
Цитата:
Here is a short HowTo for those who are familiar with Adobe Suite.

You will need a vector map with regions (states or provinces) of your country
Open the map in Adobe Illustrator CS5 or CS6
Create a new document in AI in the size 637px x 314px
Copy your vector map and paste in new document you have created
Scale the map in the new document of the right size.
Now you can change colors of regions (states or provindes)
Next go to menu Window and activate Attributes
Marks a region (province or state) and in Attributs - Imagemap you will set -> Polygon and the url (region_name1.html). This is repeated for all regions.
Now save the document.
At last go to "Save for web" and save the picture as jpeg with html

Now you will have the coords for the map.jpg
The keys are the url e.g. region_name1.html without .html
Now you can edit the original map.tpl with the keys and coords you have.

Последний раз редактировалось Rise, 21.07.2017 в 23:30.
Ответить с цитированием
  #3 (permalink)  
Старый 21.07.2017, 23:47
Аспирант
Отправить личное сообщение для maxg5 Посмотреть профиль Найти все сообщения от maxg5
 
Регистрация: 16.08.2016
Сообщений: 89

Rise,
А подскажите пожалуйста какой формат мне нужен. По какому запросу гуглить?
Мне самому придется делать. Дизайнера уже не найти.
Ответить с цитированием
  #4 (permalink)  
Старый 22.07.2017, 00:19
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

maxg5,
Что гуглить? Берешь Adobe Illustrator и делаешь как написано.
Ответить с цитированием
  #5 (permalink)  
Старый 22.07.2017, 00:25
Аспирант
Отправить личное сообщение для maxg5 Посмотреть профиль Найти все сообщения от maxg5
 
Регистрация: 16.08.2016
Сообщений: 89

Rise,
Не совсем понял что там написано.
1. Изначально создаем новый документ в Adobe Illustrator размером 637px x 314px
2. Открываем SVG файл в Adobe Illustrator и копируем на созданный документ.
А дальше не понятно что делать.
Ответить с цитированием
  #6 (permalink)  
Старый 22.07.2017, 00:59
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 4,662

maxg5,
https://translate.google.ru/
https://www.youtube.com/watch?v=xda_1cEgU4M
Ответить с цитированием
  #7 (permalink)  
Старый 22.07.2017, 01:16
Аспирант
Отправить личное сообщение для maxg5 Посмотреть профиль Найти все сообщения от maxg5
 
Регистрация: 16.08.2016
Сообщений: 89

Rise,
Все понял.
Дошел до последнего пункта - Save for web
У меня на выходе получается графический файл. Как получить HTML?
Вот такое окно открывается при заходе в Save for web:
Ответить с цитированием
  #8 (permalink)  
Старый 22.07.2017, 01:21
Аспирант
Отправить личное сообщение для maxg5 Посмотреть профиль Найти все сообщения от maxg5
 
Регистрация: 16.08.2016
Сообщений: 89

Все, разобрался, спасибо!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как лучше подключать SVG объект Black_Star (X)HTML/CSS 0 02.12.2016 00:09
SVG CSS, SVG to WOFF kobezzza Firefox/Mozilla 2 29.03.2013 15:59
Inline SVG as background Paguo-86PK Элементы интерфейса 0 16.12.2011 20:12
Простой графический движок: SVG vs Canvas stryaponoff Общие вопросы Javascript 5 29.06.2010 16:59
svg. обработка событий amigo* Элементы интерфейса 0 23.06.2010 22:31