c# - 如何在C#中的柱形图顶部添加百分比

Question

所以，问题来了。

我有一个图表，其中显示了两列，已完成和未完成，跨多种工作类型，使用以下循环:

foreach (var workType in model.WorkTypes)
        {
            decimal completed = 0;
            decimal uncompleted = 0;
            decimal workSubmitted = 0;
            decimal completionRate= 0;
            foreach (var rec in model.JobList.Where(x => x.jobType== workType.Id))
            {
                uncompleted += model.JobList.SingleOrDefault(x => x.recID== rec.recID && x.jobType == workType.Id).Uncompleted;
                completed += model.JobList.SingleOrDefault(x => x.recID == rec.recID && x.jobType == workType.Id).Completed;

            }
            workSubmitted = uncompleted + completed;

            if (uncompleted != 0)
            {
                completionRate= (completed/ workSubmitted) * 100;
            }                
            myChart.Series["Uncompleted"].Points.AddXY(workType.TypeName, uncompleted );
            myChart.Series["Completed"].Points.AddXY(workType.TypeName, completed);
        }

我想要做的是让它在两列上方显示一个标签，以百分比形式显示每个工作类型的完成率值。

如有任何帮助或建议，我们将不胜感激。

这是图表的当前外观:

Answer 1

默认情况下，Labels 显示 y 值，但您可以为每个 DataPoint 设置任意 Label，例如当你像这样添加点时:

int p = myChart.Series["Uncompleted"].Points.AddXY(workType.TypeName, rejections);
myChart.Series["Uncompleted"].Points[p].Label = sometext;

当然你可以根据需要计算标签的文本，例如:

string sometext = (workSubmitted / rejections * 100).ToString("0.00") + "%";

请注意，您必须在更改计算中的值后更新 Label。不支持自动表达式!

更新

如我所写，将Label居中放置在各列共享的 x 值处很难甚至不可能；那是因为 Label 属于一个单独的数据点。这是柱形图(和条形图)特有的问题，因为这里系列的点显示在簇中，围绕着共同的 x 值。 (当且仅当我们有一个奇数系列时，我们可以通过将标签添加到中点来解决)

所以我们需要使用Annotations。这是一个函数，它将放置一个 TextAnnotation 以 x 值和两个数据点中较大的 y 值的高度为中心..:

void setCenterAnnotation(Chart chart, ChartArea ca, 
                         DataPoint dp1, DataPoint dp2, string lbl)
{
        TextAnnotation ta = new TextAnnotation();
        ta.Alignment = ContentAlignment.BottomCenter;
        ta.AnchorAlignment = ContentAlignment.TopCenter;
        DataPoint dp = dp1.YValues[0] > dp2.YValues[0] ? dp1 : dp2;
        ta.Height = 0.36f;
        ta.AxisX = ca.AxisX;
        ta.AxisY = ca.AxisY;
        ta.AnchorDataPoint = dp;
        ta.AnchorX = dp1.XValue;
        ta.Text =  lbl;
        chart.Annotations.Add(ta);
}

如果你有两个以上的 Series 你最好确定 anchor ，即之前具有较大值的那个，然后传递它而不是我在这里传递的两个点..

放置/锚定注释不是很明显，所以这里有一些注意事项:

• 我锚定到数据点，使其显示在其 y 值的高度处。

• 要使用(轴-)值进行锚定，必须为其分配一个或两个轴。

• 我然后(顺序很重要!)设置 AnchorX 属性，使其不以点为中心，而是以公共(public) x 值为中心。

• 我还设置了一些高度，否则文本不会在列的顶部向上移动；不太确定这里的基本原理是什么..

结果如下:

我在添加点的同时添加了注释:

int ix = s1.Points.AddXY(i, rnd.Next(i+7));
s2.Points.AddXY(i, rnd.Next(i+4)+3);
double vmax = Math.Max(s1.Points[ix].YValues[0], s2.Points[ix].YValues[0]);
string lbl = (vmax / 123f).ToString("0.0") + "%";
setCenterAnnotation(chart12, ca, s1.Points[ix], s2.Points[ix], lbl );