DevExress笔记

Posted 2020-09-28 Sunny秋刀鱼

最近用DevExpress的WPF图表控件做柱形图看板，总结记录了一些笔记：

1.显示图例：

 <dxc:ChartControl.Legend>
    <dxc:Legend />
 </dxc:ChartControl.Legend>

 

2.柱形图标题：

<dxc:ChartControl.Titles>
     <dxc:Title HorizontalAlignment="Center" VerticalAlignment="Center" Content="焊接" Foreground="#03CACC"/>
   </dxc:ChartControl.Titles>

 

3.柱形图颜色：

 <dxc:ChartControl.Palette>
     <dxc:YellowPalette/>
  </dxc:ChartControl.Palette>

 

4.柱形图外区域填充背景色：

 <dxc:XYDiagram2D.DefaultPane>
      <dxc:Pane DomainBorderBrush="#343246" DomainBrush="#343246" />
  </dxc:XYDiagram2D.DefaultPane>

5.柱形图颜色设置为一样：ColorEach="True"

 <dxc:XYDiagram2D Background="#343246"  SeriesDataMember="Name" BorderBrush="#FF343246">
                <dxc:XYDiagram2D.SeriesTemplate>
                    <dxc:BarSideBySideSeries2D  Background="#343246"  LabelsVisibility="True"   ArgumentDataMember="Name" ValueDataMember="Value" ColorEach="True">
                        <dxc:BarSideBySideSeries2D.Label>
                            <dxc:SeriesLabel Background="#343246"  ConnectorVisible="False" Indent="0" dxc:BarSideBySideSeries2D.LabelPosition="Outside">
                                <dxc:SeriesLabel.ElementTemplate>
                                    <DataTemplate>
                                        <Label Content="{Binding Text}" Foreground="Green"  FontSize="15"/>
                                    </DataTemplate>
                                </dxc:SeriesLabel.ElementTemplate>
                            </dxc:SeriesLabel>
                        </dxc:BarSideBySideSeries2D.Label>
                    </dxc:BarSideBySideSeries2D>
                </dxc:XYDiagram2D.SeriesTemplate>
                <dxc:XYDiagram2D.AxisX>
                    <dxc:AxisX2D>
                        <dxc:AxisX2D.Label>
                            <dxc:AxisLabel Foreground="White"  BorderBrush="Black"/>
                        </dxc:AxisX2D.Label>
                    </dxc:AxisX2D>
                </dxc:XYDiagram2D.AxisX>
                <dxc:XYDiagram2D.AxisY>
                    <dxc:AxisY2D GridLinesVisible="False">
                        <dxc:AxisY2D.Label>
                            <dxc:AxisLabel Background="#343246" Foreground="White" BorderBrush="#FF343246"/>
                        </dxc:AxisY2D.Label>
                    </dxc:AxisY2D>
                </dxc:XYDiagram2D.AxisY>
                <dxc:XYDiagram2D.DefaultPane>
                    <dxc:Pane DomainBorderBrush="#343246" DomainBrush="#343246" />
                </dxc:XYDiagram2D.DefaultPane>
                <dxc:LineSeries2D MarkerVisible="True" Background="#343246" LabelsVisibility="True" ArgumentDataMember="Key" ValueDataMember="Value" x:Name="series1" Brush="#FF343246">
                    <dxc:LineSeries2D.LineStyle>
                        <dxc:LineStyle Thickness="1"/>
                    </dxc:LineSeries2D.LineStyle>
                </dxc:LineSeries2D>
            </dxc:XYDiagram2D>

View Code

 

6.设置平行X轴的横线：

 <dxc:AxisY2D.ConstantLinesInFront>
      <dxc:ConstantLine Brush="#FF0000" LegendText="计划产量">
           <dxc:ConstantLine.Title>
                <dxc:ConstantLineTitle  Content="计划产量：20"/>
           </dxc:ConstantLine.Title>
            <dxc:ConstantLine.Value>
                 <sys:Int32>20</sys:Int32>
           </dxc:ConstantLine.Value>
     </dxc:ConstantLine>
</dxc:AxisY2D.ConstantLinesInFront>

7.设置Y轴坐标(X轴类似)：

<dxc:AxisY2D.Label>
    <dxc:AxisLabel Background="#343246" Foreground="White" BorderBrush="#FF343246"/>
</dxc:AxisY2D.Label>

8.设置低于平行X轴的横线的颜色(根据柱子的值，设置柱子不同颜色)：

dxc:ChartControl 的 CustomDrawSeriesPoint="chartControl_CustomDrawSeriesPoint" 事件：

 <dxc:ChartControl  Background="#343246" Name="chartControl1" Grid.Row="2"  Grid.Column="0" 
                           HorizontalAlignment="Left"   VerticalAlignment="Top"  CustomDrawSeriesPoint="chartControl_CustomDrawSeriesPoint" >

 

C#代码：

private void chartControl_CustomDrawSeriesPoint(object sender, CustomDrawSeriesPointEventArgs e)
        {
           CorrectDrawOptions(e.SeriesPoint.Value, e.DrawOptions);
        }
        private void CorrectDrawOptions(double val, DrawOptions drawOptions)
        {
            if (drawOptions!=null&&val <250)
            {
                drawOptions.Color = Color.FromArgb(0xFF, 0xC7, 0x39, 0x0C);  //Red
            }
            else if (val < 350)
            {
                drawOptions.Color = Color.FromArgb(0xFF, 0xF9, 0xAA, 0x0F);  //Yellow
            }
            else
            {
                drawOptions.Color =Color.FromArgb(0xFF, 0x51, 0x89, 0x03); //Green
            }
        }

9.折线图滚动条：

Diagram.AxisX.Range.Auto = false; //要开启滚动条必须将其设置为false
Diagram.EnableAxisXScrolling = true;//启用滚动条
Diagram.AxisX.Range.SideMarginsEnabled = false;//启用滚动条

XYDiagram Diagram { get { return chartControl1.Diagram as XYDiagram; } }

 

10.设置Y轴最小坐标和最大坐标

((XYDiagram2D)this.chartControl1.Diagram).AxisY.WholeRange = new Range() { MinValue = 0, MaxValue = 300 };