彩票走势图

Chart FX for WPF图表控件如何简化图表(二)

原创|使用教程|编辑:郝浩|2013-03-07 16:19:21.000|阅读 754 次

概述:在上一篇文章《Chart FX for WPF图表控件如何简化图表(一)》中实现了图表的简化,节省了大量的控件。在本次的文章中,我们将会增加新的功能到已经简化了的图表上。

# 慧都年终大促·界面/图表报表/文档/IDE等千款热门软控件火热促销中 >>

相关链接:

    在上一篇文章《Chart FX for WPF图表控件如何简化图表(一)》中实现了图表的简化,节省了大量的控件。在本次的文章中,我们将会增加新的功能到已经简化了的图表上。图表中所绘制的范围上有一个最大和最小值,如果想要在背景上绘制一个浅灰色的矩形,这个矩形使用这个最大值和最小值范围,并且和原来的图表进行重叠,这样的话,如果图表上有任何的值超出了范围,就可以很直观的看见。

    要实现上面的效果,现在有2个关键的问题,首先为了最小化空间,Y轴是不可见的,但是如果想要使用轴部分来展示这个范围,必须确保轴是可见的,但是要求没有任何的标签或是网格线。XAML需要隐藏网格和标签,像下面这样:

<cfx:Chart.AxisY>
  <cfx:Axis Separation="0">
    <cfx:Axis.Labels>
      <cfx:AxisLabelAttributes Visibility="Collapsed"/>
    </cfx:Axis.Labels>
    <cfx:Axis.Grids>
      <cfx:Grids>
        <cfx:Grids.Major>
          <cfx:GridLine Visibility="Collapsed" TickMark="None"/>
        </cfx:Grids.Major>
        <cfx:Grids.Minor>
          <cfx:GridLine Visibility="Collapsed" TickMark="None"/>
        </cfx:Grids.Minor>
      </cfx:Grids>
    </cfx:Axis.Grids>
  </cfx:Axis>
</cfx:Chart.AxisY>

    想要直观的隐藏网格线和标签,设置Separation为0 ,是最小化轴空间的关键。现在要创建一个轴部分,将设置每个产品的最小和最大之间的范围,所以会假设数据层类ProductInfo有2个额外的属性,分别为MinDownloads和MaxDownloads。

<cfx:Axis.Sections>
      <cfx:AxisSection From="{Binding Path=MinDownloads}"
                       To="{Binding Path=MaxDownloads}" Background="#A0A0A0" />
    </cfx:Axis.Sections>

效果如下:

Chart FX for WPF图表控件如何简化图表(二)

现在来看看怎么样在最大值上记性标记呢?具体代码如下:

<cfx:Chart.ConditionalAttributes>
    <cfx:ConditionalAttributes>
      <cfx:ConditionalAttributes.Condition>
        <cfx:MaximumValueCondition/>
      </cfx:ConditionalAttributes.Condition>
      <cfx:ConditionalAttributes.Marker>
        <cfx:MarkerAttributes Visibility="Visible" Fill="Red"
                              Size="6" Shape="Circle" />
      </cfx:ConditionalAttributes.Marker>
    </cfx:ConditionalAttributes>
  </cfx:Chart.ConditionalAttributes>

Chart FX for WPF图表控件如何简化图表(二)

 ;   如果说想要显示每个图表最后一个值的点标签的话,我们可以使用相同的类,将其绑定到X值,代码如下:

<cfx:ConditionalAttributes>
        <cfx:ConditionalAttributes.Condition>
          <cfx:MaximumValueCondition BindingPath="X"/>
        </cfx:ConditionalAttributes.Condition>
        <cfx:ConditionalAttributes.PointLabels>
          <cfx:PointLabelAttributes Visibility="Visible" Offset="3,0"
                                    HorizontalAlignment="Right"
                                    VerticalAlignment="Center" FontSize="7"/>
        </cfx:ConditionalAttributes.PointLabels>
      </cfx:ConditionalAttributes>

Chart FX for WPF图表控件如何简化图表(二)


标签:

本站文章除注明转载外,均为本站原创或翻译。欢迎任何形式的转载,但请务必注明出处、不得修改原文相关链接,如果存在内容上的异议请邮件反馈至chenjj@pclwef.cn

文章转载自:慧都控件

为你推荐

  • 推荐视频
  • 推荐活动
  • 推荐产品
  • 推荐文章
  • 慧都慧问
扫码咨询


添加微信 立即咨询

电话咨询

客服热线
023-68661681

TOP