Opened 12 years ago
Closed 11 years ago
#8750 closed defect (wontfix)
Unify Linear Gradients in VML vs SVG
Reported by: | jvenema | Owned by: | Eugene Lazutkin |
---|---|---|---|
Priority: | high | Milestone: | 1.5 |
Component: | DojoX GFX | Version: | 1.3.0b1 |
Keywords: | gfx, gradient, vml, svg | Cc: | |
Blocked By: | Blocking: |
Description
If you create a VML gradient, the coordinates are relative to the shape, but for SVG, they're relative to the container. This is due to the "gradientUnits", which in svg.js are set to "userSpaceOnUse". This does not work, and should be "objectBoundingBox" to get consistent results across browsers. (Note: it can also be left off, at least in FF, as this is the default value). As a result of this, the x1, x2, y1, y2 coords may need some tweaking as well, I'm not sure. I was playing around with percentages, and they seem to work fairly well across both browsers, as long as a parseFloat() is added prior to using the values in calculations in IE (for example, when calculating the angle for the gradient).
My fix for now is to comment out line 202 of svg.js (setting the gradient units) and to add to vml.js:
dojo.forEach(['x1','x2','y1','y2'],function(x){
if(x in f){ f[x] = parseFloat(f[x]); }
});
prior to calculating and setting the angle.
I have not tested the radial gradients.
Change History (3)
comment:1 Changed 12 years ago by
comment:2 Changed 11 years ago by
Milestone: | 1.4 → future |
---|
comment:3 Changed 11 years ago by
Milestone: | future → 1.5 |
---|---|
Resolution: | → wontfix |
Status: | new → closed |
Closed in favor of #10937.
It should be noted that this fix is not 100%; if you rotate the shape, the gradient doesn't move 100% correctly in IE (it fades a little). I haven't confirmed if this behaviour is new after the fix, or was there before as well.