Error invalid value for transform

[gcharpentier]

I have this error : Error: Invalid value for attribute transform=" " joint.nojquery.js:8622

This test in setAttribute correct the error but i don't if is the good way :+1:

if(name=="transform" && value == " ") value='';

Thanks

[DavidDurman]

Do you have any use case where this happens? Let's fix the root cause of the issue, not patch it.

Cheers

[justshrey]

Hi David,

You can see the error in any of the demo included in jointjs

1) Open basic.html ( I have checked in the latest chrome beta build: 35.0.1916.114) 2) Look at the console , you should see the following

Error: Invalid value for <text> attribute transform=" " joint.js:16886
setAttribute joint.js:16886

I think this is quite a critical error, as it does affect toJson() function too.

A point to note is that the error is not present in Firefox 29.0.1

[justshrey]

Just a quick note. My sense is that this happens when certain browsers interpret the spaces in values of the attributes.

The easiest workaround for this, is basically, to trim the value if it is a string before setting it in the attribute.

I have been able to patch this by fixing setAttribute function from

 else {
            el.setAttribute(name, value);
        }

to the following

     else {
              if (typeof value == "string") {
                value = value.trim();
            }
            el.setAttribute(name, value);

As David said, this is a workaround. The real question is, why is there an extra space generated while building up the transform string.

[kumilingus]

Hi, that's been fixed and pushed to the repository. That extra space was generated in Vectorizer (methods translate(), scale() and rotate()).

Regards, Roman

2014-05-22 5:38 GMT+01:00 Shreyas N notifications@github.com:

Just a quick note. My sense is that this happens when certain browsers interpret the spaces in values of the attributes.

The easiest workaround for this, is basically, to trim the value if it is a string before setting it in the attribute.

I have been able to patch this by fixing setAttribute function from

else { el.setAttribute(name, value); }

to the following

 else {
          if (typeof value == "string") {
            value = value.trim();
        }
        el.setAttribute(name, value);

As David said, this is a workaround. The real question is, why is there an extra space generated while building up the transform string.

— Reply to this email directly or view it on GitHubhttps://github.com/DavidDurman/joint/issues/68#issuecomment-43847882 .

[mavarazy]

Not sure this is related, but I'm getting something similar: Error: Invalid value for attribute transform="scale(Infinity,Infinity)"

[mavarazy]

I debugged my issue, the problem was in resize function in joint.dia.element

scalableBbox had height and width set to 0, which caused division by zero and Infinity result

I've updated it manually from

scalable.attr('transform', 'scale(' + (size.width / scalableBbox.width) + ',' + (size.height / scalableBbox.height) + ')');

to scalable.attr('transform', 'scale(' + (size.width / (scalableBbox.width == 0 ? 1 : scalableBbox.width)) + ',' + (size.height / (scalableBbox.height == 0 ? 1 : scalableBbox.height)) + ')');

What is wrong in my use, that I had to do this?

[kumilingus]

Hi Mavarazy,

it's not related. I suggest to take a look at this thread https://groups.google.com/forum/#!topic/jointjs/JXCm0P2a3U0.

Could it be that you create the paper on a container that is not in the live DOM yet? Note that browsers don't give elements a dimension till their in the RenderTree (similar to DOM tree but contains only elements that are to be rendered on the screen, also associates CSS styles and other information with elements).

Regards, Roman

[drewnoakes]

Is this fix in a released version? Looks like it was fixed in d7b81970ef83fb4db89fabcceeacdccdc8e07394 which doesn't appear to be in version 0.9. Am I mistaken?

Also this page lists 0.8.1 as the latest release, yet this page references 0.9.0.

[etangreal]

Hi I'm getting this error in chrome (Version 36.0.1985.125) Error: Invalid value for attribute transform=" "

on line: 16886 el.setAttribute(name, value);

Strange thing is its only using chrome - firefox is fine ...

[hugoruscitti]

Hi, i only get this error when i use a 'canvas' element in chrome. When i use a 'div' element it's works fine. I use chrome and the jontjs 0.9.0 release.

See this examples:

Fails (with canvas element):

• http://jsfiddle.net/qs7svnrt/

Works (with div element):

• http://jsfiddle.net/tn89nfxn/