ASP.NET Charting饼图 - 每个切片的内部和外部标签

时间:2017-11-19 08:57:31

标签: c# asp.net .net charts asp.net-charts

在现有的应用程序中(Web表单,但底层的Microsoft Charting堆栈对于winforms / webforms / razor图表基本相同)我有Pie Charts,每个切片都有以下业务数据:

  1. 标签
  2. 颜色(用于分类,多个切片的颜色相同)
  3. 要求是一个图表,其中所有信息布局都在一个图表中,如下所示(模型):

    Pie Chart with both inside and outside Labels

    使用系列/点上的CustomProperties我可以使用Inside

    显示每个数据点

    Pie Chart with Labels inside

    或外部标签:

    Pie Chart with Labels outside

    但不是两者兼而有之。我可以以某种方式欺骗饼图显示两个每个数据点的内部和外部标签吗?

    我意识到这是一个边缘情况(通常你会使用图例+颜色来显示它,但我们已经使用颜色进行分类)。我宁愿首先避免渲染到位图并在那里手动渲染标签文本(因为有适当的机制将图表流式传输到网页和生成的文档)。

1 个答案:

答案 0 :(得分:1)

创建两个系列和两个图表区域并叠加它们:

enter image description here

<强> ASPX:

<asp:Chart ID="Chart1" runat="server">
    <series>
        <asp:Series ChartType="Pie" 
            Name="Series1" 
            CustomProperties="PieLabelStyle=Inside, PieStartAngle=270" 
            BorderColor="White" 
            ChartArea="ChartArea1">
        </asp:Series>
        <asp:Series ChartType="Pie" 
            Name="Series2" 
            CustomProperties="PieLabelStyle=Outside, PieStartAngle=270" 
            ChartArea="ChartArea2">
        </asp:Series>
    </series>
    <chartareas>
        <asp:ChartArea Name="ChartArea1" >
            <InnerPlotPosition Height="95" Width="45.98404" X="27.00798" Y="2.50000072" />
        </asp:ChartArea>
        <asp:ChartArea Name="ChartArea2" 
            AlignWithChartArea="ChartArea1"
            AlignmentOrientation="All"
            BackColor="Transparent">
            <InnerPlotPosition Height="95" Width="45.98404" X="27.00798" Y="2.50000072" />
        </asp:ChartArea>
        </chartareas>
</asp:Chart>

<强> CS:

protected void Page_Load(object sender, EventArgs e)
{
    List<MyDataModel> data = new List<MyDataModel> {
        new MyDataModel { Color = Color.LightBlue, Label = "Value 1", Value = 100 },
        new MyDataModel { Color = Color.LightBlue, Label = "Value 2", Value = 100 },
        new MyDataModel { Color = Color.LightBlue, Label = "Value 3", Value = 100 },
        new MyDataModel { Color = Color.Blue, Label = "Value 4", Value = 100 },
        new MyDataModel { Color = Color.Blue, Label = "Value 5", Value = 400 },
    };

        foreach (MyDataModel dm in data)
        {
            Chart1.Series[0].Points.Add(new DataPoint
            {
                Color = dm.Color,
                Label = dm.Value.ToString(),
                YValues = new double[] { dm.Value }
            });

            Chart1.Series[1].Points.Add(new DataPoint
            {
                Color = Color.Transparent,
                Label = dm.Label,
                YValues = new double[] { dm.Value }
            });
        }
}