如何使asp：Chart Legend符号垂直对齐

Question

我正在使用asp.net生成一个类似于下面代码生成的图表。 请注意，每个图例条目占据三行，但符号在中心垂直对齐，我认为看起来不清楚：

是否可以垂直对齐符号，使其位于第一行文本旁边（例如，第一条蓝线应位于“Some name - 1”旁边）？或者，可以配置某种分隔符吗？无论哪种方式，我都希望垂直对齐，但两种选择都很合适。

完整的演示代码：

Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    Dim chart1 As New Chart
    Page.Controls.Add(chart1)
    chart1.ChartAreas.Add(New ChartArea)
    Dim l As New Legend
    chart1.Legends.Add(l)
    Dim dt As New DataTable
    dt.Columns.Add(New DataColumn With {.ColumnName = "ColA", .DataType = GetType(System.String)})
    dt.Columns.Add(New DataColumn With {.ColumnName = "ColB", .DataType = GetType(System.Int32)})
    dt.Columns.Add(New DataColumn With {.ColumnName = "ColC", .DataType = GetType(System.Int32)})
    dt.Columns.Add(New DataColumn With {.ColumnName = "ColD", .DataType = GetType(System.Int32)})
    Dim rnd As New Random
    For i As Integer = 1 To 5
        Dim dr As DataRow = dt.NewRow
        dr.Item("ColA") = String.Format("{0} {1}", "Some name - ", i.ToString)
        dr.Item("ColB") = rnd.Next(0, 100)
        dr.Item("ColC") = rnd.Next(0, 100)
        dr.Item("ColD") = rnd.Next(0, 100)
        dt.Rows.Add(dr)
    Next
    Dim gv As New GridView
    Page.Form.Controls.Add(gv)
    gv.DataSource = dt
    gv.DataBind()
    For Each dr As DataRow In dt.Rows
        Dim s As New Series
        s.Name = dr.Item("ColA").ToString
        s.ChartType = SeriesChartType.Line
        s.LegendText = s.Name & Environment.NewLine & "Line 2" & Environment.NewLine & "Line 3"
        chart1.Series.Add(s)
        For i As Integer = 1 To dt.Columns.Count - 1
            Dim p As New DataPoint
            p.SetValueY(Convert.ToInt32(dr.Item(i)))
            p.AxisLabel = dt.Columns(i).ColumnName
            Trace.Warn(dt.Columns(i).ColumnName & " = " & Convert.ToInt32(dr.Item(i)).ToString)
            s.Points.Add(p)
        Next
    Next
    chart1.DataBind()
End Sub

Answer 1

您可以使用Chart.CustomizeLegend event自定义图例项目的对齐和分隔符：

Imports System.Drawing

Protected Sub Chart_CustomizeLegend(sender As Object, e As CustomizeLegendEventArgs)
    For Each item As LegendItem In e.LegendItems
        ' Align the series symbol.
        item.Cells(0).Alignment = ContentAlignment.TopCenter

        ' Add a separator.
        item.SeparatorType = LegendSeparatorStyle.Line
        item.SeparatorColor = Color.LightGray
    Next
End Sub

Protected Sub Page_Load(sender As Object, e As EventArgs) Handles Me.Load
    Dim chart1 As New Chart

    ' Bind to the CustomizeLegend event.
    AddHandler chart1.CustomizeLegend, AddressOf Chart_CustomizeLegend

    Page.Controls.Add(chart1)
    chart1.ChartAreas.Add(New ChartArea)
    Dim l As New Legend

    ' ... The rest of your code...
End Sub

Answer 2

删除了我之前的回答，你的评论显然是正确的。

我可以再试一次吗？怎么样：因为线条放在行的中间，传说开头的三个空行怎么样？这样，该行将出现在“Some name”旁边。

s.LegendText = Environment.NewLine & Environment.NewLine & Environment.NewLine & s.Name & Environment.NewLine & "Line 2" & Environment.NewLine & "Line 3"