Styles > Bevel Style Type
If you need to create bevel effects for any of chart objects, you'll need to use the Bevel Style Type with the following list of properties:

Properties

Description

Angle

The angle of the bevel. Valid values are from 0 to 360 degrees. The default value is 45

Distance

The offset distance of the bevel. Valid values are in pixels (floating point). The default value is 4.

shadowColor

The shadow color of the bevel. Valid values are in hexadecimal format RRGGBB (without #). The default value is 000000

shadowAlpha

The alpha transparency value of the shadow color. This value is specified as a normalized value from 0 to 100. For example, 25 set a transparency value of 25%. The default value is 50.

highlightColor

The highlight color of the bevel. Valid values are in hexadecimal format RRGGBB (without #). The default value is FFFFFF

highlightAlpha

The alpha transparency value of the highlight color. The value is specified as a normalized value from 0 to 100. For example, 25 sets a transparency value of 25%. The default value is 50.

blurX

The amount of horizontal blur in pixels. Valid values are from 0 to 255 (floating point). The default value is 4. Values that are a power of 2 (such as 2, 4, 8, 16, and 32) are optimized to render more quickly than other values

Blurry

The amount of vertical blur in pixels. Valid values are from 0 to 255 (floating point). The default value is 4. Values that are a power of 2 (such as 2, 4, 8, 16, and 32) are optimized to render more quickly than other values

Strength

The strength of the imprint or spread. Valid values are from 0 to 255. The larger the value, the more color is imprinted and the stronger the contrast between the bevel and the background. The default value is 1

Quality

The number of times to apply the filter. The default value is 1, which is equivalent to low quality. A value of 2 is medium quality, and a value of 3 is high quality. Filters with lower values are rendered more quickly
 

To set the bevel for any object of the chart, you just need to define a Bevel Style Type and apply it as under:

<style name='MyFirstBevel' type='Bevel' />

…
<apply toObject='DataPlot' styles='MyFirstBevel' />

 

It will give you the following effect:
 

Setting angle and distance
You can set the bevel angle and distance as under:
<style name='MyFirstBevel' type='Bevel' distance='7' angle='200'/>

 

Property

Format

Example

Distance

distance='value (in pixels)'

distance='7'

Angle

angle='value (between 0 to 360)'

angle='200'
 

And it looks like this now:
 

Setting shadow colors
To change shadow color and alpha, you can use the following parameters:
<style name='MyFirstBevel' type='Bevel' shadowColor='000000' shadowAlpha='80' distance='5' angle='45'/>

 

Property

Format

Example

shadowColor

shadowColor='Hex Value (without #)'

shadowColor='000000'

shadowAlpha

shadowAlpha='value (between 0 to 100)'

shadowAlpha='80'
 

It will change the shadow color as under:
 

Controlling blur amount

You can also change the blur amount to get a smoother bevel.
<style name='MyFirstBevel' type='Bevel'  blurX='12' blurY='12'/>

 

Property

Format

Example

blurX

blurX='value'

blurX='12'

Blurry

blurY='value'

blurY='12'
 

The above gives the following output:
Original with default blur
With both blurX and blurY set as 12
 

Increasing bevel strength
To increase bevel strength, use the strength attribute as under:
<style name='MyFirstBevel' type='Bevel' strength='3'/>

 

Property

Format

Example

Strength

strength='value'

strength='3'
 

You can play with a plethora of aforementioned properties and style type to get the look you want.