Legend Alignment and Layout
- 3 minutes to read
This topic describes how to position the legend within a chart’s area, and how to adjust the layout of legend items.
The topic consists of the following sections.
Legend Positioning
The spacing between the legend’s edge and other chart elements (the diagram and chart titles) is determined by the Legend.Margins property.
The horizontal and vertical alignment of the legend within a chart is determined by the LegendBase.AlignmentHorizontal and LegendBase.AlignmentVertical properties. These properties allow you to place the legend inside or outside the diagram. The following images show how these properties work.
AlignmentHorizontal = RightOutside AlignmentVertical = TopOutside | AlignmentHorizontal = Right AlignmentVertical = Top |
---|---|
You can control the legend size relative to the diagram size with the LegendBase.MaxHorizontalPercentage and LegendBase.MaxVerticalPercentage properties. These properties determine the maximum size of the legend compared to an overall dimension of the chart (its width or height), as a percentage. For example, you can use these properties to restrict the legend size to half of the chart size, regardless of the number of items in the legend. The following images demonstrate these properties in action.
MaxHorizontalPercentage = 100 | MaxHorizontalPercentage = 60 |
---|---|
MaxVerticalPercentage = 100 | MaxVerticalPercentage = 60 |
Use caution when you specify both properties simultaneously. If the legend size is too small, the legend items may not fit into the available dimensions nor be displayed.
As shown in the images above, the legend’s items are broken into multiple columns, to fit its reduced size. This may cause the items to shift across each other due to their different lengths. In this case (when the LegendBase.Direction property is set to either LeftToRight or RightToLeft), you can use the LegendBase.EquallySpacedItems property, which makes the space between items equal, with no regard to the length of each item. This gives a more professional look to the chart. The following images demonstrate this property in action.
EquallySpacedItems = false | EquallySpacedItems = true |
---|---|
Legend Item Layout
To define the direction in which the legend items are arranged, use the LegendBase.Direction property. The following images demonstrate its various settings.
Direction = TopToBottom | Direction = LeftToRight |
---|---|
Note that items are arranged in a single row only if it is possible based on the chart size (or the legend’s LegendBase.MaxVerticalPercentage and LegendBase.MaxHorizontalPercentage property settings). Otherwise, items are arranged in columns.
The space between the legend’s edge and its items is determined by the LegendBase.Padding property.
The space between legend items is determined by the LegendBase.HorizontalIndent and LegendBase.VerticalIndent properties. The following image demonstrates them in action.
Also, you can use the LegendBase.TextOffset property to adjust the space between a marker and its text.
The visibility of markers and their text is determined by the Legend.MarkerVisible and LegendBase.TextVisible properties, respectively. When both properties are disabled, the legend becomes invisible.