Blog

Adding borders to your DialCharts that use an image background

You may have an older DialChart template that uses a premade background image that looks something similar to the image below. This old workaround is now unnecessary because the built in border is currently a default feature in DialCharts. Note that you can easily add in the “DialOuterBorder” param into your old DialChart template. This […]

Author:
Date:
March 18, 2013
Category:
Design Approaches

You may have an older DialChart template that uses a premade background image that looks something similar to the image below. This old workaround is now unnecessary because the built in border is currently a default feature in DialCharts.

DialBG

Note that you can easily add in the “DialOuterBorder” param into your old DialChart template. This param allows you to edit its colors and light source effects.

test_Dial_no_border

To enable the border feature (without the need for a background image) in NCDesigner 7.0:

Import/Open the old version Dial chart.
In the left “Presentation” tab, click to highlight “General”.
Check “Use Borders”.
Set a border width of for example 20 px.
Choose Color 1 to be black and set the Fade to 30%
Choose Color 2 to be white and set the Fade to 0%.

test_Dial_border

And finally here’s an image of what the DialChart looks like with the Borders enabled and using the steps above. The color of the gradient fill as well as the color of the light source and the shadow parts can easily be edited inside of NetCharts Designer 7.0.

Comments are closed.