Skip to content

Latest commit

 

History

History
329 lines (275 loc) · 12.5 KB

datachart-docking-legends.adoc

File metadata and controls

329 lines (275 loc) · 12.5 KB
Raw

Docking Legends

This topic explains, with a code example, how to dock a legend to the {DataChartName}™ control.

Introduction

Legends, just like other User Interface (UI) controls can be docked to the {DataChartName} control plot area. Legends are docked by first wrapping the {DataChartName} and Legend controls with the xamDock™ container control and then setting the respective docking properties. (Table 1 below) Alternatively, you can wrap the {DataChartName} and the other controls with {PlatformName} host controls like the StackPanel, Grid, and others.

Figure 1: The {DataChartName} control with Legend controls docked in different locations of the chart plot area

Docking Properties

Table 1 explains the available properties for docking Legend objects to the {DataChartName} control.

Table 1: Properties for docking child controls in the xamDock control

Property Name Type Description Default Value

xamDock.Edge

Determines dock edge of a child control in the xamDock container. The available values are:

  • Central

  • InsideBottom

  • InsideLeft

  • InsideRight

  • InsideTop

  • OutsideBottom

  • OutsideLeft

  • OutsideRight

  • OutsideTop

InsideTop

xamDock.VerticalDockAlignment

VerticalAlignment

Determines vertical dock alignment of a child control in the xamDock container. The available values are:

  • Top

  • Center

  • Bottom

  • Stretch

Top

xamDock.HorizontalDockAlignment

HorizontalAlignment

Determines horizontal dock alignment of a child control in the xamDock container. The available values are:

  • Left

  • Center

  • Right

  • Stretch

Left

Code Example

The following example provides all possible docking locations of legends relative to the chart plot area. But only one of the Legend objects provided can be used at time and bound to the Legend property of the {DataChartName} control. In order to display multiple legends per series then you need to bind the legend to Legend property of the Series object instead of that of the {DataChartName} control. For further details, refer to the Multiple Legends topic. pick:[win-phone="For information on how to optimize the visual space of the chart in Windows® Phone, refer to the Chart Orientation and Layout topic."]

Note
Note:

This example assumes that you know how to set up your application for the xamDock and {DataChartName} controls and bind the data context to the chart. If you need information about this, refer to the Getting Started with Data Chart topic.