Closed bhartvigsen closed 6 years ago
So I figured out how to add drop shadows, it's pretty straightforward DOM manipulation, adding a filter section to the \<svg> and then attaching it to the pie element with a filter attribute. Only thing I'm stuck on is that I can add the shadows manually with the developer tools but when I use jQuery to do the same thing the chart blanks out. Perhaps I need to call some sort of chart re-draw function...
EDIT: I figured it out, you can't use jQuery to manipulate SVG, but I used the Pablo library and was successfully able to add drop shadows. Here's a short example:
Pablo('#pieChart svg').append('<defs><filter id="f3" x="0" y="0" width="200%" height="200%"><feOffset result="offOut" in="SourceAlpha" dx="10" dy="10" /><feGaussianBlur result="blurOut" in="offOut" stdDeviation="10" /><feBlend in="SourceGraphic" in2="blurOut" mode="normal" /></filter></d efs>');
$('.p0_pieChart').attr('filter', 'url(#f3)');
Hi sorry to bug you with an issue but I have a quick question; can you think of a way to implement SVG drop shadows (feOffset) underneath the charts using this library?