Как применить матрицу преобразования к координатам пути в Raphael JS 2?
Я хочу применить или "запечь" преобразование нескольких путей в Raphael JS 2, чтобы затем я мог объединить их в один единственный путь.
Вот пример пути, где я хотел бы, чтобы атрибут "transform" применялся ко всем координатам "d".
<path style="" fill="#000000" stroke="none" d="M150,-265C182,-275,171,-220,180,-194L178,-194C181,-192,180,-185,181,-180C211,-169,282,-173,306,-166C308,-169,316,-171,315,-165C268,-157,225,-148,184,-137C188,-118,186,-96,190,-79L282,-131C289,-131,296,-135,297,-126C293,-118,271,-105,236,-80C190,-48,155,-20,125,-6C112,-15,115,-34,111,-51C121,-70,108,-107,107,-133C70,-132,-5,-126,0,-157C18,-170,39,-181,64,-191C75,-190,92,-181,100,-185C99,-198,95,-211,89,-225Z" transform="matrix(0.1389, 0, 0, 0.1389, 291.91, 235.465)" stroke-width="7.199999999999999">
Я понимаю, что фреймворк svg-edit может преобразовывать координаты пути в абсолютные позиции и удалять матрицу преобразования в процессе.
Некоторые связанные вопросы, на которые я не смог получить ответ:
2 ответа
Частичное решение можно найти в этом jsFiddle: http://jsfiddle.net/X6YNm/1/
//include whoa font, and raphael
paper = Raphael('holder');
var text = paper.print(300, 50, 'Foo', paper.getFont('whoa'), 50, 'baseline');
var path = new Array();
for ( var i = 0; i < text.length; i ++ ) {
path[i] = paper.path(Raphael.pathToRelative(text[i].attr('path')));
path[i].attr({ fill: 'red' }).translate(i * 250, 300);
}
Он создает новый путь, основанный на каждом символе в исходном наборе. Тем не менее, скрипка неправильно расставляет символы.
Некоторые связанные обсуждения в группе Google Raphael: Некоторые обсуждения группы Google здесь: https://groups.google.com/d/msg/raphaeljs/OP29oelR5Eg/zPi5m6rjsvIJ
Вот jsFiddle, который применяет все преобразования для вас: http://jsfiddle.net/ecmanaut/cFSjt/
Возможно, что Рафаэль выставляет некоторые или все инструменты, которые я сам заполнил, но если нет, они прекрасно справляются с задачей. Если ваши потребности также охватывают больше элементов, не относящихся к пути (таких как группы, линии, круги, эллипсы и т. Д.), Сначала преобразуйте их в элементы пути (например, с помощью pathify).