Come applicare la matrice di trasformazione alle coordinate del percorso in Raphael JS 2?

Question

voglio applicare o 'cuocere' una trasformazione di diversi percorsi in Raphael JS 2, in modo che possa poi combinarle in un unico percorso.

Ecco un esempio di percorso, dove desidero l'attributo "trasformare" da applicare a tutti gli "d" coordinate.

<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"> 

Sono consapevole che il quadro SVG-edit può convertire percorso coordinate posizioni assolute, e rimuovere la matrice di trasformazione nel processo.

Alcune domande correlate, che non ho potuto ottenere la mia risposta da:

• Baking transforms into SVG Path Element commands
• How to apply a transformation matrix?

Answer 1

Una soluzione parziale in cui si trovano questo 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); 
} 

It cr mangia un nuovo percorso, basato su ogni personaggio nel set originale. Tuttavia, il violino non occupa correttamente i caratteri.

Alcune spiegazioni dettagliate sulla gruppo raphael google: Alcune discussioni gruppo Google qui: https://groups.google.com/d/msg/raphaeljs/OP29oelR5Eg/zPi5m6rjsvIJ

Answer 2

Ecco un jsFiddle che applica tutte le trasformazioni per voi: http://jsfiddle.net/ecmanaut/cFSjt/

E 'possibile che Raffaello espone alcune o tutte le strumenti che ho riempito in me stesso, ma se no, questi fanno bene il trucco. Se le vostre esigenze di copertura più elementi non-path troppo (come gruppi, rettangoli, cerchi, ellissi, e così via), prima convertirli in elementi di percorso (utilizzando pathify, per esempio).