バージョン

凡例

このトピックは、ItemLegend を使用するために XamPieChart™ の構成する情報を提供します。

概要

このトピックは、以下のセクションで構成されます。

要件

前提条件として「データ バインディング」トピックを呼んだ、データにバインドされる円チャートを作成しました。

プロパティ

XamPieChart の隣に凡例を表示するには、ItemLegend を作成し、Legend プロパティに割り当てます。 LegendLabelMemberPath は、各円スライスの凡例項目を表示するために使用するデータ モデルのプロパティを指定します。

また、凡例項目の外観をカスタマイズするために LegendItemTemplate および LegendItemBadgeTemplate、 ItemLegend の複数のフォント プロパティも使用できます。凡例項目の外観に影響するプロパティのリストは以下です。

プロパティ名 プロパティ タイプ 説明

XamPieChart プロパティ:

DataTemplate

各凡例項目を描画する DataTemplate。

string

各円スライスの凡例項目を表示するために値を使用するデータ モデルのプロパティ。

DataTemplate

各凡例項目のバッジ アイコンを描画する DataTemplate。

ItemLegend プロパティ:

FontFamily

各凡例項目で使用するフォント ファミリ。

double

各凡例項目で使用するフォント サイズ。

FontStretch

各凡例項目で使用するフォント伸縮。

FontStyle

各凡例項目で使用するフォント スタイル。

FontWeight

各凡例項目で使用するフォントの太さ。

Brush

各凡例項目で使用する前景色。

HorizontalAlignment

各凡例項目で使用する水平方向の配置。

VerticalAlignment

各凡例項目で使用する垂直方向の配置。

PieChartWithLegend WPF.png

XAML の場合:

<Grid x:Name="RootLayout">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="Auto"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <ig:XamPieChart x:Name="pieChart" Grid.Column="1"
                    ItemsSource="{Binding Path=EnergyData}"
                    ValueMemberPath="Coal"
                    LabelMemberPath="CountryAbbreviation"
                    Legend="{Binding ElementName=itemLegend1}">
        <ig:XamPieChart.LegendItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal" Margin="1" Visibility="{Binding Series.Visibility}">
                    <ContentPresenter Content="{Binding}"
                                      ContentTemplate="{Binding Series.LegendItemBadgeTemplate}"/>
                    <TextBlock Text="{Binding Path=Item.Country}"
                               Foreground="{Binding Series.Legend.ItemsForeground}"
                               FontStretch="{Binding Series.Legend.ItemsFontStretch}"
                               FontStyle="Italic"
                               FontWeight="Bold"
                               FontSize="16"
                               FontFamily="MS Arial"/>
                </StackPanel>
            </DataTemplate>
        </ig:XamPieChart.LegendItemTemplate>
    </ig:XamPieChart>

    <ig:ItemLegend x:Name="itemLegend1" Grid.Column="0"/>
</Grid>

C# の場合:

// Get the DataTemplate from where ever you have it defined.
DataTemplate customLegendItemTemplate = this.Resources["CustomLegendItemTemplate"] as DataTemplate;

ItemLegend legend = new ItemLegend();

XamPieChart pieChart = new XamPieChart();
pieChart.ItemsSource = EnergyData;
pieChart.ValueMemberPath = "Coal";
pieChart.LabelMemberPath = "CountryAbbreviation";
pieChart.LegendItemTemplate = customLegendItemTemplate;
pieChart.Legend = legend;

Visual Basic の場合:

'Get the DataTemplate from where ever you have it defined.
Dim customLegendItemTemplate As DataTemplate
customLegendItemTemplate = TryCast(Me.FindResource("CustomLegendItemTemplate"), DataTemplate)

Dim legend As New ItemLegend()

Dim pieChart As New XamPieChart()
pieChart.ItemsSource = EnergyData
pieChart.ValueMemberPath = "Coal"
pieChart.LabelMemberPath = "CountryAbbreviation"
pieChart.LegendItemTemplate = customLegendItemTemplate;
pieChart.Legend = legend

関連コンテンツ