you may also want add the x and y to the filter with negative amounts so you can see the full effect of the filter
glad it worked for you Garry <svg xmlns="http://www.w3.org/2000/svg"; width="100%" height="100%"> <desc> <!-- put a description here --> </desc> <defs> <filter id="gaussFilter" x="-100%" y="-100%" width="500%" height="500%" > <feGaussianBlur stdDeviation="4" /> <feOffset dx="1.0" dy="2.0" /> </filter> </defs> <rect id="underlying" rx="5" ry="5" width="117" height="23.0" x="333.3333333333333" y="300.0" class="gauss" filter="url(#gaussFilter)" > <set attributeName="fill" attributeType="CSS" begin="button.click" to="red"/> </rect> <rect id="button" height="20.0" rx="5" ry="5" stroke="black" width="112.5" x="333.3333333333333" y="300.0"> <set attributeName="fill" attributeType="CSS" begin="click" to="red"/> </rect> </svg> --- In [email protected], Manuel Cañ³® L󰥺 <[EMAIL PROTECTED]> wrote: > > > > > The effect of the Gaussian filtr is to spread out the element by > > diffusion - as result what you seeing is not that the blur has square > > corners, you are just seeing a limited view > > > Great... I did not realize until now of the limited view... > > > Can i suggest that, for test purposes, you do the following: > > > > 1) Move the underlying element away from the button so you can see > > some changes > > > > 2) add height and width to the filter element by % > > try 100% , 400%, 800% > > > > 3) change the StD of the blur > > try 10 5 2 > > > > 4) change the rx and ry of your underlying <rect> > > try 115 65 40 20 > > > > I think this might help you understand what the filter is doing > > > Yes, it did! thanks!!!! > > > i changed your code like this > > > > <svg xmlns="http://www.w3.org/2000/svg"; width="100%" height="100%"> > > <desc> > > <!-- put a description here --> > > </desc> > > <defs> > > <filter id="gaussFilter" width="800%" height="800%" > > > <feGaussianBlur stdDeviation="5.0"/> > > <feOffset dx="4.0" dy="2.0"/> > > </filter> > > </defs> > > <rect id="underlying" > > rx="20" ry="20" width="117" height="23.0" > > x="333.3333333333333" > > y="300.0" > > class="gauss" filter="url(#gaussFilter)" > > > <set attributeName="fill" attributeType="CSS" > > begin="element1.click" to="red"/> > > </rect> > > <rect id="button" height="20.0" rx="5" ry="5" stroke="black" > > width="112.5" > > x="333.3333333333333" y="300.0"> > > <set attributeName="fill" attributeType="CSS" > > begin="element1.click" to="red"/> > > </rect> > > > > </svg> > > > > please let me know if this helps... > > It helped a lot, overall the width and height filter attribute.. now it > looks great. > > Thanks again! ----- To unsubscribe send a message to: [EMAIL PROTECTED] -or- visit http://groups.yahoo.com/group/svg-developers and click "edit my membership" ---- Yahoo! Groups Links <*> To visit your group on the web, go to: http://groups.yahoo.com/group/svg-developers/ <*> To unsubscribe from this group, send an email to: [EMAIL PROTECTED] <*> Your use of Yahoo! Groups is subject to: http://docs.yahoo.com/info/terms/
