1

Здравствуйте! Имеется интерактивная карта здания. Нужно создать визуальный редактор карты, по такому принципу: Указываем крайние точки объекта, узнаем координаты. Подложка - png изображение. Работаю с библиотекой Raphael для визуализации.

Вопрос: как узнать координаты в таком виде, как с SVG изображения.

path = "M313,847L353,847L353,787L353,779L308,779L308,847"
6
  • а при чем тут jquery ?
    – zb'
    27 авг 2013 в 13:57
  • редактор карты пишу с использованием jQuery. Указал для того, чтобы при возможности упомянули нужную функцию.
    – DreammakeR
    27 авг 2013 в 14:01
  • Не совсем понял что нужно узнать, в любом случае стоит начать с документации SVGPathElement, вероятно понадобится свойство normalizedPathSegList. 27 авг 2013 в 14:41
  • Допустим пользователь отмечает 4 точки на рисунке, создавая "квадрат". Нужно узнать координаты области "квадрат" в указанном формате.
    – DreammakeR
    27 авг 2013 в 21:18
  • 1
    @DreammakeR, ну а в чем проблема? Не знаю как с Raphael, но на чистом js это делается примерно так: запоминаете координаты кликов, форматируете строку d, создаете dom элемент для path (не забудьте указать namespace svg), добавляете в него аттрибут d, ну и еще какие пожелаете, добавляете получившийся элемент в нужное место в svg.
    – dzhioev
    27 авг 2013 в 23:53

1 ответ 1

2

Для решения проблемы использовал готовый редактор карт Summer (статья о нем на Хабре).

В базе координаты были нужны в виде:

path = "M313,847L353,847L353,787L353,779L308,779L308,847"

Данный редактор работал с координатами в виде:

 <area shape="poly" coords="313,847,353,847,353,787,353,779,308,779,308,847" />

Как вы можете увидеть разница в том, что во втором случае просто нет символов.

Написал маленький парсер для базы (может кому пригодится).

while ($line = mysql_fetch_array($result, MYSQL_ASSOC)) {
  $col_value = $line['path'];
  $col_value = str_replace(array('M', ' '), '', $col_value);
  $col_value = str_replace(array('Z', ' '), '', $col_value);
  $col_value = str_replace(array('C'),',',$col_value);
  $col_value = str_replace(array('L'),',',$col_value);
}

Получил координаты в нужном в виде и загружал в редактор.

Всем спасибо за внимание!

1
  • @DreammakeR, может все-таки лучше так: $path = "M313,847L353,847L353,787L353,779L308,779L308,847"; $res = preg_split('/[MZCL,]+/',$path); Результат: Array ( [0] => [1] => 313 [2] => 847 [3] => 353 [4] => 847 [5] => 353 [6] => 787 [7] => 353 [8] => 779 [9] => 308 [10] => 779 [11] => 308 [12] => 847 ) Остается только убрать пустые значения массива. Напр., array_filter()
    – Deonis
    10 сен 2013 в 9:04

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.