WPF DevExpress ChartControl

 

 

前端

     <!--完整坐標圖-->
                    <dxc:ChartControl  Grid.Row="1" Grid.Column="1"  Name="LbarChart" BorderThickness="0" EnableAnimation="True"  Background="#FF3D6DAF" >
                        <!--鼠標選擇后顯示的面板-->
                        <dxc:ChartControl.CrosshairOptions>
                            <dxc:CrosshairOptions ShowArgumentLine="True" GroupHeaderPattern="{}時間: {A}">
                                <dxc:CrosshairOptions.CommonLabelPosition>
                                    <dxc:CrosshairFreePosition DockTarget="{Binding ElementName=pane}"/>
                                </dxc:CrosshairOptions.CommonLabelPosition>
                            </dxc:CrosshairOptions>
                        </dxc:ChartControl.CrosshairOptions>
                        <!--坐標圖-->
                        <dxc:ChartControl.Diagram  >
                            <dxc:XYDiagram2D LabelsResolveOverlappingMinIndent="2"  x:Name="Ldiagram">

                                <!--整個坐標面板-->
                                <dxc:XYDiagram2D.DefaultPane>
                                    <dxc:Pane x:Name="Lpane"  DomainBrush="#FF3D6DAF" Foreground="White" />

                                </dxc:XYDiagram2D.DefaultPane>
                                <!--Y軸設置-->
                                <dxc:XYDiagram2D.AxisY>
                                    <dxc:AxisY2D GridLinesMinorVisible="True">
                                        <dxc:AxisY2D.Title>
                                            <dxc:AxisTitle Content="溫度濕度線性圖" />
                                        </dxc:AxisY2D.Title>
                                    </dxc:AxisY2D>
                                </dxc:XYDiagram2D.AxisY>
                                <!--X軸設置-->
                                <dxc:XYDiagram2D.AxisX>
                                    <dxc:AxisX2D GridLinesVisible="True" />
                                </dxc:XYDiagram2D.AxisX>

                                <!--坐標圖系列-->
                                <dxc:XYDiagram2D.Series>
                                    <dxc:LineSeries2D x:Name="LBarSideSerie"
                                              DisplayName="溫度"
                                              MarkerSize="{Binding ElementName=slMarkerSize, Path=Value}"
                                              MarkerVisible="{Binding ElementName=chbMarkers, Path=IsChecked}"   AnimationAutoStartMode="SetStartState">
                                        <dxc:LineSeries2D.Label>
                                            <dxc:SeriesLabel ConnectorVisible="False"
                                                     ResolveOverlappingMode="Default"        dxc:MarkerSeries2D.Angle="{Binding ElementName=slAngle, Path=Value}"
                                                     Visible="{Binding ElementName=chbVisible, Path=IsChecked}" />
                                        </dxc:LineSeries2D.Label>
                                        <dxc:LineSeries2D.Points>

                                        </dxc:LineSeries2D.Points>
                                    </dxc:LineSeries2D>

                                    <dxc:LineSeries2D x:Name="LBarSideSerie2"
                                              DisplayName="濕度"
                                              MarkerSize="{Binding ElementName=slMarkerSize, Path=Value}"
                                              MarkerVisible="{Binding ElementName=chbMarkers, Path=IsChecked}"   AnimationAutoStartMode="SetStartState">
                                        <dxc:LineSeries2D.Label>
                                            <dxc:SeriesLabel ConnectorVisible="False"
                                                     ResolveOverlappingMode="Default"        dxc:MarkerSeries2D.Angle="{Binding ElementName=slAngle, Path=Value}"
                                                     Visible="{Binding ElementName=chbVisible, Path=IsChecked}" />
                                        </dxc:LineSeries2D.Label>
                                        <dxc:LineSeries2D.Points>

                                        </dxc:LineSeries2D.Points>
                                    </dxc:LineSeries2D>

                                    <dxc:LineSeries2D x:Name="LBarSideSerie3"
                                              DisplayName="壓強"
                                              MarkerSize="{Binding ElementName=slMarkerSize, Path=Value}"
                                              MarkerVisible="{Binding ElementName=chbMarkers, Path=IsChecked}"   AnimationAutoStartMode="SetStartState">
                                        <dxc:LineSeries2D.Label>
                                            <dxc:SeriesLabel ConnectorVisible="False"
                                                     ResolveOverlappingMode="Default"        dxc:MarkerSeries2D.Angle="{Binding ElementName=slAngle, Path=Value}"
                                                     Visible="{Binding ElementName=chbVisible, Path=IsChecked}" />
                                        </dxc:LineSeries2D.Label>
                                        <dxc:LineSeries2D.Points>

                                        </dxc:LineSeries2D.Points>
                                    </dxc:LineSeries2D>
                                </dxc:XYDiagram2D.Series>

                            </dxc:XYDiagram2D>
                        </dxc:ChartControl.Diagram>
                        <!--圖例-->
                        <dxc:ChartControl.Legend>
                            <dxc:Legend HorizontalPosition="Right" Foreground="White"  Background="{x:Null}" />
                        </dxc:ChartControl.Legend>
                    </dxc:ChartControl>

　后台綁定值

  /// <summary>
        /// 坐標綁值
        /// </summary>
        /// <param name="TempData"></param>
        /// <param name="BarSideSerie"></param>
        /// <param name="diagram"></param>
        /// <param name="Name"></param>
        /// <param name="IsAddSecondaryY">是否添加第二坐標</param>
        public void SetBadingData(ParamVM TempData, LineSeries2D BarSideSerie, XYDiagram2D diagram, string Name, SolidColorBrush _brush, bool IsAddSecondaryY = true)
        {
            try
            {

                List<DevExpress.Xpf.Charts.SeriesPoint> lsBarPoint = new List<DevExpress.Xpf.Charts.SeriesPoint>();  //投入柱形圖數據源  
                List<PPPTS> lstPPPTS = new List<PPPTS>();

                #region 溫度

                List<DevChartData> lst = new List<DevChartData>();

                lst = TempData.Lst.OrderByDescending(a => a.StartTime).ToList();

                lsBarPoint.Clear();


                List<DevChartData> lst2 = new List<DevChartData>();
                foreach (var item in lst)
                {
                    lst2.Add(item);
                    if (lst2.Count > 100) break;

                }

                lst2 = lst2.OrderBy(a => a.StartTime).ToList();
                foreach (var item in lst2)
                {
                    lsBarPoint.Add(new DevExpress.Xpf.Charts.SeriesPoint() { Argument = DataConvert.GetValDateTime(item.StartTime).ToString("HH:mm"), Value = DataConvert.GetValDouble(item.ProductionLong) });
                }

                BarSideSerie.Points.Clear();
                BarSideSerie.Points.AddRange(lsBarPoint); 
                BarSideSerie.Animate();
                BarSideSerie.ArgumentScaleType = DevExpress.Xpf.Charts.ScaleType.Qualitative;
                BarSideSerie.LabelsVisibility = true;//顯示標注標簽  
                BarSideSerie.LabelsVisibility = false;//顯示標注標簽  

                BarSideSerie.Brush = _brush;//暫時不使用

                if (IsAddSecondaryY)
                {

                    #region 是否添加第二坐標

                    SecondaryAxisY2D ys = null;
                    foreach (var item in diagram.SecondaryAxesY)
                    {
                        if (item.Title.Content.ToString() == Name)
                        {
                            ys = item;
                            diagram.SecondaryAxesY.Remove(ys);
                            break;
                        }
                    }

                    SecondaryAxisY2D y1 = new SecondaryAxisY2D();

                    y1.Alignment = AxisAlignment.Near;
                    y1.FontSize = 12;
                    y1.Title = new AxisTitle() { Content = Name };
                    y1.Title.Foreground = _brush;
                    y1.Title.FontSize = 12;
                    y1.Title.Alignment = TitleAlignment.Far; //頂部對齊
                    y1.Range = new AxisRange() { MaxValue = DataConvert.GetValDouble(TempData.theMax) * (1.2), MinValue = DataConvert.GetValDouble(TempData.theMin) * (0.8) };  
                    y1.Brush = _brush;
                    y1.FontSize = 12;





                    y1.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF; 
                    y1.FontSize = 12;
                    y1.OpacityMask = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;    
                    //AxisY.Visible = false;
                    y1.Brush = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF; 
                    y1.Label = new AxisLabel();
                    y1.Label.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF; 

                    y1.Title.Visible = true;
                    y1.Visible = false;

                    diagram.SecondaryAxesY.Add(y1);
                    XYDiagram2D.SetSeriesAxisY(BarSideSerie, y1);
                    #endregion


                }
                else
                {
                    AxisY2D AxisY = ((DevExpress.Xpf.Charts.XYDiagram2D)diagram).ActualAxisY;
                    DevExpress.Xpf.Charts.AxisRange _Range = new DevExpress.Xpf.Charts.AxisRange() { MaxValue = DataConvert.GetValDouble(TempData.theMax) * (1.2), MinValue = DataConvert.GetValDouble(TempData.theMin) * (0.8) };
                    AxisY.Range = _Range;

                   

                    AxisY.Title = new AxisTitle() { Content = Name };
                    AxisY.Title.FontSize = 12;
                    AxisY.Title.Alignment = TitleAlignment.Far; //頂部對齊 
                    AxisY.Title.Foreground = _brush;  

                     
                    AxisY.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF; 
                    AxisY.FontSize = 12; 
                    AxisY.OpacityMask = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF;    
                    AxisY.Brush = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF; 
                    AxisY.Label = new AxisLabel();
                    AxisY.Label.Foreground = new SolidColorBrush((Color)ColorConverter.ConvertFromString("#FFFFFF"));//0000FF; 

                    AxisY.Title.Visible =  false;
                    AxisY.Visible = true;
                };

                #endregion
            }
            catch (Exception)
            {

                throw;
            }
        }