【问题标题】:Silverlight Toolkit Chart: Assign Hyperlink to AxisSilverlight 工具包图表:将超链接分配给轴
【发布时间】:2011-03-28 01:03:23
【问题描述】:

我有一个简单的 Silverlight 工具包图表,它绑定到以下类型的集合:

public class ChartItemClass
{
    public string Name { get; set; }
    public double Value { get; set; }
    public string Url { get; set; }
}

我可以得到一个图表来正确显示名称(X 轴)和值(Y 轴),但我希望 X 轴上的标签是 Url 属性的 HyperlinkBut​​tons。 X 轴标签应如下所示:

<HyperlinkButton Content="*Name Property Here*" NavigateUri="*Url Property Here*" TargetName="_blank"></HyperlinkButton>

我找到了一个示例,它允许我为 X 轴设置 AxisLabelStyle,因此标签现在是 HyperlinkBut​​tons。问题是我无法将 Url 属性分配/绑定为 NavigateUri。有什么想法吗?

【问题讨论】:

  • SO 上的标签无法理解,即使我不知道“图表”和“图表”之间的区别。无论如何,问题得到了回答。

标签: silverlight xaml charts silverlight-toolkit styling


【解决方案1】:

首先我会发布完整的代码,然后是解释。

   <UserControl.Resources>
    <Style x:Key="hyperlinkStyle" TargetType="charting:AxisLabel">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="charting:AxisLabel">
                    <HyperlinkButton Content="{Binding Name}" NavigateUri="{Binding Url}" TargetName="_blank"/>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</UserControl.Resources>

<charting:Chart>
    <charting:Chart.Series>
        <charting:ColumnSeries ItemsSource="{Binding Items}" DependentValueBinding="{Binding Value}" IndependentValueBinding="{Binding}">
            <charting:ColumnSeries.IndependentAxis>
                <charting:CategoryAxis Orientation="X" AxisLabelStyle="{StaticResource hyperlinkStyle}" />
            </charting:ColumnSeries.IndependentAxis>
        </charting:ColumnSeries>
    </charting:Chart.Series>
</charting:Chart>

诀窍就在这一行:

IndependentValueBinding="{Binding}"

使用此绑定,您可以将整个对象传递给独立轴,而不仅仅是一个属性。 然后就可以在label的控件模板中获取绑定对象的属性了:

Content="{Binding Name}" NavigateUri="{Binding Url}"

Binding 关键字而不是 TemplateBinding 看起来很奇怪,但它是允许的并且有效。 还有一点要注意:Url 属性必须包含 http 前缀。它不适用于www

【讨论】:

  • 就是这样。除了 IndependentValueBinding="{Binding}" 之外,您的代码与我所拥有的代码几乎完全相同(我很抱歉没有将其包含在原始消息中并让您输入整个内容)。感谢您的帮助!
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2011-04-21
  • 1970-01-01
  • 2011-05-10
  • 2016-05-21
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多