0

Windows 8 Metro XAML プレビュー コントロールを使用するアプリを構築しています。サンプル アプリをダウンロードして調べましたが、ほとんどの場合、コード ビハインドを使用してチャートに必要なすべてのものを定義しています。バインディングで同様のことを達成しようとしていますが、チャートは空のままです。実際には、彼らはデータを取得しますが、何もプロットしません (たとえば、RadPieChart の境界線と RadCartesianChart のすべてのゼロを見ることができます)。RadPieChart のコードは次のとおりです。

<telerik:RadPieChart>
    <telerik:PieSeries ItemsSource="{Binding AssetsData}" />
</telerik:RadPieChart>

また、AssetsData は次のように定義されています。

private ElementCollection<PieDataPoint> assetsData;
public ElementCollection<PieDataPoint> AssetsData
{
    get
    {
        return assetsData;
    }
    set
    {
        assetsData = value;
        Notify("AssetsData");
    }
}

次のように、データを入力します。

PieSeries series = new PieSeries();
series.RadiusFactor = 0.9;

foreach (var entry in dataSource)
{
    series.DataPoints.Add(new PieDataPoint() { Value = entry.Percentage, Label = entry.Title });
}

assetsData = series.DataPoints;

サンプル アプリのようにコード ビハインド (C#) を使用すると、すべて正常に動作します。シリーズを定義し、データポイントをシリーズに追加して、そのシリーズをチャート コントロールに追加します。同じデータを使用してこのようにバインドしようとすると、機能しません。

ここで何が間違っていますか？

コレクション内の値が正しく設定されているかどうかを確認しましたが、正しく設定されています (コード ビハインドを使用する場合と同じロジックを使用しているため、実際には違いはないはずです)。

また、RadCartesianChart を設定して、描画されているデータに応じて最小値と最大値をスケーリングする方法はありますか?

4

2 に答える 2

1

コントロールにも苦労しましたが、プログラムでパレットを定義する必要があることに気付くまで、チャートに何かを表示させることができませんでした。現時点ではこの例がありますが、来週はチャートにもう少し取り組み、より良いコードを投稿できます。しかし、これで少なくとも始めることができます。

            <Grid Height="520" Grid.Row="1" Margin="10">
          <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="Auto" />
          </Grid.RowDefinitions>
          <StackPanel Grid.Row="0" Background="#007EA9" Height="auto" Width="500">
            <Border Background="#007EA9">
              <telerik:RadCartesianChart x:Name="barChart" Margin="0,6,0,0" Height="250" Width="230">
                <telerik:RadCartesianChart.HorizontalAxis>
                  <telerik:CategoricalAxis LabelFitMode="MultiLine">
                    <telerik:CategoricalAxis.LabelStyle>
                      <Style TargetType="TextBlock">
                        <Setter Property="MaxWidth" Value="10" />
                        <Setter Property="Margin" Value="4" />
                      </Style>
                    </telerik:CategoricalAxis.LabelStyle>
                  </telerik:CategoricalAxis>
                </telerik:RadCartesianChart.HorizontalAxis>
                <telerik:RadCartesianChart.VerticalAxis>
                  <telerik:LinearAxis Maximum="200" Minimum="0">
                    <telerik:LinearAxis.LabelStyle>
                      <Style TargetType="TextBlock">
                        <Setter Property="Width" Value="10" />
                        <Setter Property="TextAlignment" Value="Right" />
                      </Style>
                    </telerik:LinearAxis.LabelStyle>
                  </telerik:LinearAxis>
                </telerik:RadCartesianChart.VerticalAxis>
                <telerik:RadCartesianChart.Grid>
                  <telerik:CartesianChartGrid MajorLinesVisibility="Y" />
                </telerik:RadCartesianChart.Grid>
              </telerik:RadCartesianChart>
            </Border>
          </StackPanel>
          <StackPanel Grid.Row="1" Height="auto" Width="500" Margin="0,35,0,0">
            <Border Background="#007EA9">
              <telerik:RadPieChart x:Name="pieChart" Margin="0,0,0,0" Height="250" Width="230" />
            </Border>
          </StackPanel>
        </Grid>

C# コード

        private void CreateSuckyChart()
    {
        double value;

        pieChart.Palette = ChartPalettes.DefaultDark;
        barChart.Palette = ChartPalettes.DefaultDark;

        var data = new List<WBDataEntry> { new WBDataEntry { Data = "Benchpress", Value = 70 }, new WBDataEntry { Data = "Squats", Value = 15 }, new WBDataEntry { Data = "Lat pulls", Value = 205 }, new WBDataEntry { Data = "Lunges", Value = 55 } };
        var series = new BarSeries();
        series.CategoryBinding = new PropertyNameDataPointBinding("Date");
        series.ValueBinding = new PropertyNameDataPointBinding("Value"); 
        this.barChart.Series.Add(series);
        var series2 = new PieSeries();
        var labelDefinition = new ChartSeriesLabelDefinition();
        labelDefinition.Margin = new Thickness(-10, 0, 0, 0);
        labelDefinition.DefaultVisualStyle = this.Resources["PieChartLabelStyle"] as Style;
        series2.LabelDefinitions.Add(labelDefinition);
        series2.RadiusFactor = 0.7;
        series2.AngleRange = new AngleRange(-90, 360);

        this.pieChart.Series.Add(series2);

        foreach (WBDataEntry indicator in data) // Class WBDataEntry has two properties, Value and Date
        {
            series2.DataPoints.Add(new PieDataPoint() { Value = indicator.Value, Label = indicator.Data });

            series.DataPoints.Add(new CategoricalDataPoint() { Value = indicator.Value , Label = indicator.Data });

        }
    }
于 2012-06-28T13:44:43.453 に答える
0

解決策を見つけたようですが、ここに解決策を投稿したいと思いました。これが私のxamlです：

<Grid>
    <Grid.Resources>
        <t:ChartPalette x:Key="CustomPalette">
            <t:ChartPalette.FillEntries>
                <t:PaletteEntryCollection>
                    <SolidColorBrush Color="Red"></SolidColorBrush>
                    <SolidColorBrush Color="Green"></SolidColorBrush>
                    <SolidColorBrush Color="Blue"></SolidColorBrush>
                    <SolidColorBrush Color="Purple"></SolidColorBrush>
                </t:PaletteEntryCollection>
            </t:ChartPalette.FillEntries>
            <t:ChartPalette.StrokeEntries>
                <t:PaletteEntryCollection>
                    <SolidColorBrush Color="Red"></SolidColorBrush>
                    <SolidColorBrush Color="Green"></SolidColorBrush>
                    <SolidColorBrush Color="Blue"></SolidColorBrush>
                    <SolidColorBrush Color="Purple"></SolidColorBrush>
                </t:PaletteEntryCollection>
            </t:ChartPalette.StrokeEntries>
        </t:ChartPalette>
    </Grid.Resources>

    <tpri:RadLegendControl LegendProvider="{Binding ElementName=pieChart}">
        <tpri:RadLegendControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Vertical"/>
            </ItemsPanelTemplate>
        </tpri:RadLegendControl.ItemsPanel>

        <tpri:RadLegendControl.ItemTemplate>
            <DataTemplate>
                <StackPanel Orientation="Horizontal">
                    <Ellipse Fill="{Binding Fill}" Stroke="{Binding Stroke}" StrokeThickness="1" Width="10" Height="10"/>
                    <TextBlock Text="{Binding Title}" Foreground="{Binding Fill}"  Margin="10" FontStyle="Italic"/>
                </StackPanel>
            </DataTemplate>
        </tpri:RadLegendControl.ItemTemplate>
    </tpri:RadLegendControl>

    <t:RadPieChart x:Name="pieChart" Palette="{StaticResource CustomPalette}">
        <t:PieSeries ItemsSource="{Binding ScoreCard}" RadiusFactor="0.8">
            <t:PieSeries.ValueBinding>
                <t:PropertyNameDataPointBinding PropertyName="Total"/>
            </t:PieSeries.ValueBinding>

            <t:PieSeries.LegendTitleBinding >
                <t:PropertyNameDataPointBinding PropertyName="Name"></t:PropertyNameDataPointBinding>
            </t:PieSeries.LegendTitleBinding>
        </t:PieSeries>
    </t:RadPieChart>
</Grid>

ScoreCard バインディングについては、次のようにしています。

private ObservableCollection<TestQuestionResult> _scoreCard;
public ObservableCollection<TestQuestionResult> ScoreCard
{
    get { return _scoreCard; }
    set { _scoreCard = value; Notify("ScoreCard"); }
}

データ クラスは次のようになります。

public class TestQuestionResult
{
    public string Name { get; set; }
    public int Correct { get; set; }
    public int Incorrect { get; set; }
    public int Total { get; set; }
}

このメソッドは、テスト用のダミー データを生成します。

private void Init()
{
    var list = new ObservableCollection<TestQuestionResult>();
    var ran = new Random(-1);

    for (var ix = 0; ix < 7; ix++)
    {
        var tq = new TestQuestionResult()
        {
            Name = ix.ToString(),
            Correct = ran.Next(321, 932),
            Incorrect = ran.Next(321, 932),
        };

        tq.Total = tq.Correct + tq.Incorrect;
        list.Add(tq);
    }

    ScoreCard = list;
}

これにより、少なくとも私が費やした時間を他の人が節約できることを願っています。:)

于 2012-11-29T14:49:48.930 に答える