Solved

3D effects in SVG

Posted on 2001-07-09
3
281 Views
Last Modified: 2008-02-01
I have the following SVG code that generates pie chart.
I need to add some 3D effect on it - even just shadow or something like this.
It is urgent.

<?xml version="1.0" standalone="yes"?>
<svg width="800" height="600">
<g id="series">
<path id="1" d="M 320 112.5 A 162.5 162.5 0 1 1 199.238938 383.733788 L 320 275 Z" style="fill:tomato"/>
<path id="2" d="M 199.238938 383.733788 A 162.5 162.5 0 0 1 168.29325 333.2348 L 320 275 Z" style="fill:magenta"/>
<path id="3" d="M 168.29325 333.2348 A 162.5 162.5 0 0 1 183.715962 186.496162 L 320 275 Z" style="fill:brown"/>
<path id="4" d="M 183.715962 186.496162 A 162.5 162.5 0 0 1 195.51785 170.54695 L 320 275 Z" style="fill:blue"/>
<path id="5" d="M 195.51785 170.54695 A 162.5 162.5 0 0 1 277.941913 118.037025 L 320 275 Z" style="fill:green"/>
<path id="6" d="M 277.941913 118.037025 A 162.5 162.5 0 0 1 320 112.5 L 320 275 Z" style="fill:indigo"/>
</g>
</svg>

Thanks.
0
Comment
Question by:pavlin
3 Comments
 
LVL 2

Accepted Solution

by:
djokov earned 200 total points
ID: 6266008
<?xml version="1.0" standalone="yes"?>
<svg width="800" height="600">
<filter id="DropShadowFilter" filterUnits="objectBoundingBox" x="-10%" y="-10%" width="120%" height="120%">
   <feGaussianBlur in="SourceAlpha" stdDeviation="2" result="BlurAlpha"/>
   <feOffset in="BlurAlpha" dx="4" dy="4" result="OffsetBlurAlpha"/>
   <feMerge>
      <feMergeNode in="OffsetBlurAlpha"/>
      <feMergeNode in="SourceGraphic"/>
   </feMerge>
</filter>
<g id="series" style="filter:url(#DropShadowFilter)" transform="scale(1 0.5)">
<path id="1" d="M 320 112.5 A 162.5 162.5 0 1 1 199.238938 383.733788 L 320 275 Z" style="fill:tomato"/>
<path id="2" d="M 199.238938 383.733788 A 162.5 162.5 0 0 1 168.29325 333.2348 L 320 275 Z" style="fill:magenta"/>
<path id="3" d="M 168.29325 333.2348 A 162.5 162.5 0 0 1 183.715962 186.496162 L 320 275 Z" style="fill:brown"/>
<path id="4" d="M 183.715962 186.496162 A 162.5 162.5 0 0 1 195.51785 170.54695 L 320 275 Z" style="fill:blue"/>
<path id="5" d="M 195.51785 170.54695 A 162.5 162.5 0 0 1 277.941913 118.037025 L 320 275 Z" style="fill:green"/>
<path id="6" d="M 277.941913 118.037025 A 162.5 162.5 0 0 1 320 112.5 L 320 275 Z" style="fill:indigo"/>
</g>
</svg>

Will help.
0
 

Author Comment

by:pavlin
ID: 6266039
Yes! Thanx friend..
0
 

Expert Comment

by:frankg77777
ID: 14886872
pavlin, djokov-
how did you create the vectors for the pie pieces?  can you do it on the fly via transformations or scripting?
i have been unable to even create separate shapes in Illustrator.
thanks
frankg77777
0

Featured Post

Master Your Team's Linux and Cloud Stack

Come see why top tech companies like Mailchimp and Media Temple use Linux Academy to build their employee training programs.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
RSS Feed Parsing for Images 5 74
XSLT XML 4 19
Configure a Bean in an XML file 4 31
XML Removal- Powershell 4 25
The Client Need Led Us to RSS I recently had an investment company ask me how they might notify their constituents about their newsworthy publications.  Probably you would think "Facebook" or "Twitter" but this is an interesting client.  Their cons…
I was working on a PowerPoint add-in the other day and a client asked me "can you implement a feature which processes a chart when it's pasted into a slide from another deck?". It got me wondering how to hook into built-in ribbon events in Office.
This Micro Tutorial hows how you can integrate  Mac OSX to a Windows Active Directory Domain. Apple has made it easy to allow users to bind their macs to a windows domain with relative ease. The following video show how to bind OSX Mavericks to …
In a recent question (https://www.experts-exchange.com/questions/28997919/Pagination-in-Adobe-Acrobat.html) here at Experts Exchange, a member asked how to add page numbers to a PDF file using Adobe Acrobat XI Pro. This short video Micro Tutorial sh…

786 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question