Задать вопрос
GeForester
@GeForester
веб-разработчик

Raphael.js и перевод растровой графики в вектор

Добрый день! Собираюсь реализовать похожую карту:

raphaeljs.com/australia.html

Но не понимаю, каким образом проще всего преобразовать растровый контур в необходимый формат который можно уже использовать в скрипте?

Пример формат региона у Raphael таков:

aus.sa = R.path("M113.819,117.351v38.96l0.502-0.251l6.602-0.641l1.064-0.212l4.26,0.426l2.343-1.276l4.046,2.129l2.981,2.342h1.917l-0.213-0.426l0.426-0.213h1.491l2.555,2.131h2.556l-0.64-0.64l0.426-0.214l0.427,0.426l0.426-0.639l2.341,2.343l-0.638,0.214v1.063l1.276-0.64l0.853,0.213l0.853,1.703l-0.64,0.854l0.213-0.639h-1.062l0.424,0.852l-0.424,0.641l0.851,0.211l-0.427,0.641l1.278,1.277l-0.426-1.277l0.64,1.277l0.639-0.426l1.277,0.853l-0.64-0.64l1.063,0.213l-0.424,0.427l1.276,1.702v1.277l2.344,2.131l1.277,5.75l0.213-0.64l0.213,0.64l0.425,0.213l-0.851,0.213l-0.427-0.853l0.213-0.213l-0.854-0.214v-0.425l-0.638,1.276l0.851-0.426l2.558,3.194l1.063-0.64l1.065,1.278l0.425-2.344l-1.49,0.64l0.641-0.427l0.213-1.703l0.851-0.427l0.427,0.427v-1.489l3.194-3.621l2.556-1.277l-0.64,0.213l0.427-0.852l0.428,0.424l1.49-0.424l1.489-4.261l1.277-1.491l0.853,0.428v-4.26l1.064,2.342l0.213,1.918l0.64,0.639l-1.704,1.49l1.277,2.343l-2.557,2.556l-0.637,1.918l-0.428,0.213l0.428,1.276l-0.641,1.278l0.426-0.213l0.215,1.277l-0.428,2.556l-0.427,0.426l-2.554-0.64l-1.066,3.194l2.13-0.214l1.704-1.275l1.49,0.638l0.853-0.425l-0.426-0.428l1.063-2.342l0.213-2.13l1.279-2.981l3.193,5.537l-0.428,0.213l-0.213-0.639l-0.213,4.686l-2.342,2.129l2.981,0.214l1.276-1.064l1.065,0.214l3.188,2.549l-3.188-2.336l2.769,2.129l1.812,2.353l-1.383-2.138l1.062,0.851l1.277,2.769l-0.564-0.873l1.631,4.281l-0.213,1.064l-1.063,1.064l0.851,1.276l-0.426,0.64l1.703,2.342l2.477,3.302l0.08,0.319l1.277,1.064l2.547,0.182v-90.426H113.819z M172.887,189.499l0.213-1.065h-1.492l0.428-1.277l-7.028,1.49l-0.426,1.064l1.278,1.491l1.918-0.213l1.49-0.427l1.703,0.853l0.852-0.64l0.213-0.853h2.77l0.424-0.851l-1.49-0.639L172.887,189.499z").attr(attr);
  • Вопрос задан
  • 4040 просмотров
Подписаться 5 Оценить 1 комментарий
Помогут разобраться в теме Все курсы
  • Яндекс Практикум
    Фронтенд-разработчик расширенный
    13 месяцев
    Далее
  • Академия Eduson
    Fullstack-разработчик на JavaScript
    11 месяцев
    Далее
  • Skillbox
    JavaScript
    3 месяца
    Далее
Решения вопроса 1
GeForester
@GeForester Автор вопроса
веб-разработчик
Ответ написан
Комментировать
Пригласить эксперта
Ответы на вопрос 2
@Makito
Для несложных регионов я использую бесплатный Inkscape. Загружаем в него картинку по которой нужно рисовать области, и пользуемся инструментом «кривые безье».
После того как все готово, вызываем xml редактор (Ctrl+Shift+X). Слева будут отмеченные нами пути, справа — их атрибуты. Нам интересен атрибут d. В нем содержатся нужные координаты, просто копируем в скрипт и радуемся.
Ответ написан
В Inkscape есть функция «Векторизовать раст..» («Меню»->«Контур»). Этим способом можно простые растровые изображения достаточно легко преобразовать в вектор, а затем ручками или упрощением контуров добиться желаемого результата.
Ответ написан
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы
ITK academy Нижний Новгород
от 50 000 до 90 000 ₽
ITK academy Казань
от 50 000 до 90 000 ₽