ASP.NET MVC图表助手。如何为图表上的每个条/列设置不同的颜色?

时间:2011-05-06 01:26:05

标签: asp.net-mvc-3 charts

我正在使用ASP.NET MVC 3.0 Chart Helper。

为什么颜色方案(例如Rainfall)仅适用于饼图和圆环图,而不适用于任何其他类型(条形图,柱等)。

所有其他图表上的条形图/列具有相同的颜色。如何解决?

这是我的图表:

chart = new System.Web.Helpers.Chart(width: 100, height: 200)
                .AddSeries(
                    chartType: Bar,
                    legend: Rainfall
                    xValue: new[] { "Jan", "Feb", "Mar", "Apr", "May" },
                    yValues: new[] { "20", "20", "40", "10", "10" });
            }

此外,我还试图使用System.Web.Helpers public static class ChartTheme中的所有方案,这些都没有帮助

2 个答案:

答案 0 :(得分:6)

我发现了一些有效的东西......它不是很好但是有效

使用旧图表

使用System.Web.UI.DataVisualization.Charting;


 public ActionResult GetRainfallChart()
    {
        Chart chart = new Chart();
        chart.BackColor = Color.Transparent;
        chart.Width = Unit.Pixel(1400);
        chart.Height = Unit.Pixel(750);

        Series series1 = new Series("Series1");
        series1.ChartArea = "ca1";
        series1.ChartType = SeriesChartType.Bar;
        series1.Font = new System.Drawing.Font("Verdana", 11f, FontStyle.Regular);
        series1.Points.Add(new DataPoint
        {
            AxisLabel = "A",
            YValues = new double[] { 100 },
            Color = Color.Green,
        });
        series1.Points.Add(new DataPoint
        {
            AxisLabel = "B",
            YValues = new double[] { 324 },
            Color = Color.Red,
        });
        series1.Points.Add(new DataPoint
        {
            AxisLabel = "C",
            YValues = new double[] { 235 },
            Color = Color.Yellow,
        });

        chart.Series.Add(series1);

        ChartArea ca1 = new ChartArea("ca1");
        ca1.BackColor = Color.Transparent;
        chart.ChartAreas.Add(ca1);

        var ms = new MemoryStream();

        chart.SaveImage(ms, ChartImageFormat.Png);
        ms.Seek(0, SeekOrigin.Begin);

        return new FileStreamResult(ms, "image/png");



    }

是的,他是对的。还有一个信息 System.Web.Helpers中的Chart Helper在内部使用'using DV = System.Web.UI.DataVisualization.Charting;'仅限ASP.Net图表控件,但包含有限的访问权限。

如果您需要更多功能,可以使用ASP.Net图表

答案 1 :(得分:4)

也许你很久以前就找到了答案,但考虑到我在寻找一种方法来对图表的条纹进行着色时,我发现这个主题很少,我认为在这里打开解决方案可能会很有用由我决定。

似乎 System.Web.Helpers.Chart 的实现与 System.Web.UI.DataVisualization.Charting.Chart 密切相关。鉴于此,我设法找到了一些关于如何配置“主题”XML属性的线索:

public const String CHARTS_THEME = @"<Chart BackColor=""#EFEFEF"" BackGradientStyle=""TopBottom"" BorderColor=""#A0A0A0"" BorderWidth=""1"" Palette=""None"" PaletteCustomColors=""#ffcc00"" >
<ChartAreas>
<ChartArea Name=""Default"" _Template_=""All"" BackColor=""Transparent"" BackSecondaryColor=""White"" BorderWidth=""1"" BorderColor=""#A0A0A0"" BorderDashStyle=""Solid"" >
<AxisY>
<MajorGrid Interval=""Auto"" LineColor=""64, 64, 64, 64"" />    
<LabelStyle Font=""Verdana, 10pt"" />
</AxisY>
<AxisX LineColor=""#000000"">
<MajorGrid Interval=""Auto"" LineColor=""64, 64, 64, 64"" />
<LabelStyle Font=""Verdana, 10pt"" />
</AxisX>
</ChartArea>
</ChartAreas>
<Legends>
<Legend _Template_=""All"" BackColor=""Transparent"" Docking=""Bottom"" Font=""Verdana, 10pt, style=Plain"" LegendStyle=""Row"">
</Legend>
    </Legends>                          
</Chart>";

这一点的关键是定义你自己的 PaletteCustomColors (我只有一种颜色)。要使其工作,必须将 调色板 属性设置为

最后,在创建图表实例时使用您的主题:

Chart chart = new Chart(width: 600, height: 200, theme:CHARTS_THEME);

另请查看 System.Web.UI.DataVisualization.Charting.Chart 的msdn文档,以了解设置图表样式的其他方法:

http://msdn.microsoft.com/en-us/library/dd467201.aspx