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 居中放置在列共享的 x 值处是很困难的，甚至是不可能的；这是因为 Label 属于单个数据点。这是柱形(和条形)类型图表的一个独特问题，因为这里系列的点显示在公共(public) x 值周围的簇中。 (当且仅当我们有奇数系列时，我们可以通过将标签添加到中点来解决)

所以我们需要使用注释。下面的函数会将 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 ，即之前值较大的 anchor ，然后传递它而不是我在这里传递的两个点。

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

• 我锚定到DataPoint，使其显示在其 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 );