Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

problem with wordcloud svg with fabric js #2730

Closed
nvadgama opened this issue Jan 11, 2016 · 2 comments · Fixed by #2738
Closed

problem with wordcloud svg with fabric js #2730

nvadgama opened this issue Jan 11, 2016 · 2 comments · Fixed by #2738

Comments

@nvadgama
Copy link

Hi,
Fabric is fabulous product thanks for giving support to us for create such a great t-shirt designer tool.
All SVG is working fine and i can add any SVG on canvas but have an issue with wordcloud svg. when i try to add wordcloud svg by loadSVGFromString then its disturb svg's styles. I have attached a screenshot and also check your demo.

Its only with tag in svg element. Can you please advise ?

SVG code find in .txt file.

screenshot-demo veesys com 2016-01-11 19-03-37

test.txt

Thanks
Rajeev

@asturur
Copy link
Member

asturur commented Jan 13, 2016

the problem is missing space between rotate and translate transformation.
I mark it as a svgimport bug. if i have time to read the svg spec and be sure the space is optional i will fix this. Chrome open the svg correctly.

IF you add the spaces fabricjs can open it too.
image

i did not add them all.

@asturur
Copy link
Member

asturur commented Jan 17, 2016

space looks mandatory by w3c spec

transform-list:
    wsp* transforms? wsp*
transforms:
    transform
    | transform comma-wsp+ transforms
transform:
    matrix
    | translate
    | scale
    | rotate
    | skewX
    | skewY
matrix:
    "matrix" wsp* "(" wsp*
       number comma-wsp
       number comma-wsp
       number comma-wsp
       number comma-wsp
       number comma-wsp
       number wsp* ")"
translate:
    "translate" wsp* "(" wsp* number ( comma-wsp number )? wsp* ")"
scale:
    "scale" wsp* "(" wsp* number ( comma-wsp number )? wsp* ")"
rotate:
    "rotate" wsp* "(" wsp* number ( comma-wsp number comma-wsp number )? wsp* ")"
skewX:
    "skewX" wsp* "(" wsp* number wsp* ")"
skewY:
    "skewY" wsp* "(" wsp* number wsp* ")"
number:
    sign? integer-constant
    | sign? floating-point-constant
comma-wsp:
    (wsp+ comma? wsp*) | (comma wsp*)
comma:
    ","
integer-constant:
    digit-sequence
floating-point-constant:
    fractional-constant exponent?
    | digit-sequence exponent
fractional-constant:
    digit-sequence? "." digit-sequence
    | digit-sequence "."
exponent:
    ( "e" | "E" ) sign? digit-sequence
sign:
    "+" | "-"
digit-sequence:
    digit
    | digit digit-sequence
digit:
    "0" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9"
wsp:
    (#x20 | #x9 | #xD | #xA)

on the other side, adding and asterisk in the regExp solve the problem.
What do you think kangax?

@asturur asturur mentioned this issue Jan 17, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants