ASP.NET Chart Controls, is it possible to use a gradient on a pie chart?
I'm prototyping a chart using ASP.NET Chart Controls. I have the following code to generate my chart. I'm trying to get as close to the client's brand guidelines as possible. The brand guidelines are using gradients in the pie chart segments. Is this possible when using custom colours?
/// <summary>
/// Create an image of a chart from the given data
/// </summary>
/// <param name="data">Dictionary of data, labels as key and value as value.</param>
/// <returns&开发者_运维百科gt;The bytes of an image</returns>
private Byte[] CreatePieChart(Dictionary<string,string> data)
{
//Set up the chart
var chart = new Chart
{
Width = 550,
Height = 400,
RenderType = RenderType.BinaryStreaming,
AntiAliasing = AntiAliasingStyles.All,
TextAntiAliasingQuality = TextAntiAliasingQuality.High
};
//Add the title
chart.Titles.Add("Chart 1");
chart.Titles[0].Font = new Font("Arial", 16f);
//Set up labels etc
chart.ChartAreas.Add("");
chart.ChartAreas[0].AxisX.TitleFont = new Font("Arial", 12f);
chart.ChartAreas[0].AxisY.TitleFont = new Font("Arial", 12f);
chart.ChartAreas[0].AxisX.LabelStyle.Font = new Font("Arial", 10f);
chart.ChartAreas[0].AxisX.LabelStyle.Angle = -90;
chart.ChartAreas[0].BackColor = Color.White;
//Set up the series and specify Pie chart
chart.Series.Add("");
chart.Series[0].ChartType = SeriesChartType.Pie;
chart.Series[0].SetCustomProperty("PieLabelStyle", "outside");
chart.Series[0].IsValueShownAsLabel = true;
chart.Series[0].BackGradientStyle = GradientStyle.Center;
//MAke the chart 3D
chart.ChartAreas[0].Area3DStyle.Enable3D = true;
//chart.ChartAreas[0].Area3DStyle.Perspective = 75;
chart.ChartAreas[0].Area3DStyle.Inclination = 0;
//Loop over the data and add it to the series
foreach (var item in data)
{
chart.Series[0].Points.AddXY(item.Key, Convert.ToDouble(item.Value));
}
//Add a legend
chart.Legends.Add("");
chart.Legends[0].InsideChartArea = "";
Color[] myPalette = new Color[6]{
Color.FromArgb(255,101,187,226),
Color.FromArgb(255,253,214,91),
Color.FromArgb(255,38,190,151),
Color.FromArgb(255,253,183,101),
Color.FromArgb(255,218,143,183),
Color.FromArgb(255,242,242,242)};
chart.Palette = ChartColorPalette.None;
chart.PaletteCustomColors = myPalette;
byte[] chartBytes;
//Write the chart image to a stream and get the bytes
using (var chartimage = new MemoryStream())
{
chart.SaveImage(chartimage, ChartImageFormat.Png);
chartBytes = chartimage.GetBuffer();
}
return chartBytes;
}
It is possible to get a gradient on a pie chart with ASP.NET charting.
Here's the relevant lines:
Color[] myPalette = new Color[5]{
Color.FromArgb(255,101,187,226),
Color.FromArgb(255,253,214,91),
Color.FromArgb(255,38,190,151),
Color.FromArgb(255,253,183,101),
Color.FromArgb(255,218,143,183)};
chart.Palette = ChartColorPalette.None;
chart.PaletteCustomColors = myPalette;
//Loop over the data and add it to the series
int i = 0;
foreach (var item in data)
{
chart.Series[0].Points.AddXY(item.Key, Convert.ToDouble(item.Value));
chart.Series[0].Points[i].BackGradientStyle = GradientStyle.Center;
chart.Series[0].Points[i].Color = myPalette[i];
chart.Series[0].Points[i].BackSecondaryColor = LightenColor(myPalette[i]);
//chart.Series[0].Points[i].SetCustomProperty("Exploded","true");
i++;
}
Prototype code. Produces a passable gradient.
精彩评论