Dev系列控件之XtraCharts(一)_忆尘-CSDN博客

来自 : CSDN技术社区 发布时间：2021-03-25

Dev系列控件之XtraCharts(一)
XtraCharts是Dev控件包一大重要控件 涵盖了一个画图控件的所有需要输出的效果 并提供了一些特色功能 并直接从流输出不需要产生临时图片文件。本文介绍一些常用的属性以及方法。
命名空间引用添加
  Code
using DevExpress.XtraCharts;
using DevExpress.XtraCharts.Web;
using DevExpress.XtraCharts.Native;
数据绑定 
  Code
private void ChartBinding(object sender)
    {
        string Str_SQL select top 7 UnitPrice,UnitsInStock,ReorderLevel,ProductID from Products order by ProductID
        DataSet DS DataHandle.ExecuteSQL(Str_SQL);
        WebChartControl1.Series.Clear();
        //定义线型 名称
        Series S1 new Series( 线条图测试 , ViewType.Line);
        //定义X轴的数据的类型。质量 数字 时间
        S1.ArgumentScaleType ScaleType.Numerical;
        //定义线条上点的标识形状
        ((LineSeriesView)S1.View).LineMarkerOptions.Kind MarkerKind.Circle;
        //线条的类型 虚线 实线
        ((LineSeriesView)S1.View).LineStyle.DashStyle DashStyle.Solid;
        //S1绑定数据源
        S1.DataSource DS.Tables[0].DefaultView;
        //S1的X轴数据源字段
        S1.ArgumentDataMember UnitPrice
        //S2的Y轴数据源字段
        S1.ValueDataMembers[0] UnitsInStock
        //柱状图演示
        Series S2 new Series( 柱状图测试 , ViewType.Bar);
        S2.ArgumentScaleType ScaleType.Numerical;
        S2.DataSource DS.Tables[0].DefaultView;
        S2.ArgumentDataMember UnitPrice
        S2.ValueDataMembers[0] ReorderLevel
        //光滑线条演示
        Series S3 new Series( 弧度曲线测试 , ViewType.Spline);
        S3.ArgumentScaleType ScaleType.Numerical;
        S3.DataSource DS.Tables[0].DefaultView;
        S3.ArgumentDataMember UnitPrice
        S3.ValueDataMembers[0] UnitsInStock
        //加入chartcontrol
        WebChartControl1.Series.Add(S1);
        WebChartControl1.Series.Add(S2);
        WebChartControl1.Series.Add(S3);
        //定义chart标题
        ChartTitle CT1 new ChartTitle();
        CT1.Text 这是第一个DEMO
        ChartTitle CT2 new ChartTitle();
        CT2.Text CopyRight By BJYD
        CT2.TextColor System.Drawing.Color.Black;
        CT2.Font new Font( Tahoma , 8);
        //标题对齐方式
        CT2.Dock ChartTitleDockStyle.Bottom;
        CT2.Alignment StringAlignment.Far;
        WebChartControl1.Titles.Clear();
        WebChartControl1.Titles.Add(CT1);
        WebChartControl1.Titles.Add(CT2);
        CT2.Indent
        //坐标标题的定义
        //坐标值说明的字体尺寸 颜色定义
        ((XYDiagram)WebChartControl1.Diagram).AxisY.Title.Font new Font( Tahoma , 10);
        ((XYDiagram)WebChartControl1.Diagram).AxisY.Title.TextColor System.Drawing.Color.Red;
        ((XYDiagram)WebChartControl1.Diagram).AxisY.Title.Text 这是测试的纵坐标
        ((XYDiagram)WebChartControl1.Diagram).AxisY.Title.Visible true;
        ((XYDiagram)WebChartControl1.Diagram).AxisX.Title.Text 这是测试的横坐标
        ((XYDiagram)WebChartControl1.Diagram).AxisX.Title.Visible true;
        DiagramOwn (XYDiagram)WebChartControl1.Diagram;
        //图例的位置定义
        WebChartControl1.Legend.AlignmentHorizontal LegendAlignmentHorizontal.Right;
        WebChartControl1.Legend.AlignmentVertical LegendAlignmentVertical.Top;
}
显示图标中的数据
  Code
private void PerformShowLablesAction()
    {
        foreach (Series serie in WebChartControl1.Series)
        {
            serie.Label.Visible cbShowData.Checked;
        }
    }
线形为Bar的时候Label属性
  Code
private void PerformBarLabelPosition()
    {
        foreach (Series serie in WebChartControl1.Series)
        {
            if (serie.Label is SideBySideBarSeriesLabel)
            {
                if (rbbarlabelpostion.SelectedIndex 0)
                {
                    ((SideBySideBarSeriesLabel)serie.Label).Position BarSeriesLabelPosition.Top;
                }
                else
                {
                    ((SideBySideBarSeriesLabel)serie.Label).Position BarSeriesLabelPosition.Center;
                }
            }
        }
    } 
显示图标的背景颜色
  Code
private void PeformChartAppearance()
    {
        WebChartControl1.AppearanceName ddlchartappearance.SelectedValue.Trim();
    }
显示自定义调色板颜色
  Code
private void PeformPalette()
    {
        WebChartControl1.PaletteName ddlpalette.SelectedValue.Trim();
    }
显示数据的图例形状
  Code
private void PefromMarkerKindAction()
    {
        foreach (Series serie in WebChartControl1.Series)
        {
            //数据点的视图形状包括大小 尺寸 类型等等 只能为线点类型
            if (serie.View is PointSeriesView)
            {
                PointSeriesView view (PointSeriesView)serie.View;
                switch (ddlmarkerkind.SelectedValue)
                {
                    case Circle :
                        view.PointMarkerOptions.Kind MarkerKind.Circle;
                        break;
                    case Cross :
                        view.PointMarkerOptions.Kind MarkerKind.Cross;
                        break;
                    case Diamond :
                        view.PointMarkerOptions.Kind MarkerKind.Diamond;
                        break;
                    case Hexagon :
                        view.PointMarkerOptions.Kind MarkerKind.Hexagon;
                        break;
                    case InvertedTriangle :
                        view.PointMarkerOptions.Kind MarkerKind.InvertedTriangle;
                        break;
                    case Pentagon :
                        view.PointMarkerOptions.Kind MarkerKind.Pentagon;
                        break;
                    case Plus :
                        view.PointMarkerOptions.Kind MarkerKind.Plus;
                        break;
                    case Square :
                        view.PointMarkerOptions.Kind MarkerKind.Square;
                        break;
                    case Star :
                        view.PointMarkerOptions.Kind MarkerKind.Star;
                        break;
                    case Triangle :
                        view.PointMarkerOptions.Kind MarkerKind.Triangle;
                        break;
                }
            }
        }
    }
定义数据的图例大小
  Code
private void PefromMarkerSizeAction()
    {
        int intsize Convert.ToInt32(ddlmarkersize.SelectedValue.Trim());
        foreach (Series serie in WebChartControl1.Series)
        {
            //数据点的视图形状包括大小 尺寸 类型等等 只能为线点类型
            if (serie.View is PointSeriesView)
            {
                ((PointSeriesView)serie.View).PointMarkerOptions.Size intsize;
            }
        }
    }
定义数据框角度
  Code
private void PerformLabelAngleAction()
    {
        foreach (Series serie in WebChartControl1.Series)
        {
            if (serie.Label is PointSeriesLabel)
            {
                ((PointSeriesLabel)serie.Label).Angle Convert.ToInt32(ddllableangle.SelectedValue.Trim());
            }
        }
    }
Spline型线条的线张力控制
  Code
private void PerformLineTensionAction()
    {
        foreach (Series serie in WebChartControl1.Series)
        {
            if (serie.View is SplineSeriesView)
            {
                ((SplineSeriesView)serie.View).LineTensionPercent int.Parse(ddlsplinetension.SelectedValue.Trim());
            }
        }
    }
说明框水平位置控制
  Code
private void PerformHorAligmentAction()
    {
        switch (ddl_legendhorizontalalign.SelectedValue.Trim())
        {
            case Center :
                WebChartControl1.Legend.AlignmentHorizontal LegendAlignmentHorizontal.Center;
                break;
            case Left :
                WebChartControl1.Legend.AlignmentHorizontal LegendAlignmentHorizontal.Left;
                break;
            case LeftOutside :
                WebChartControl1.Legend.AlignmentHorizontal LegendAlignmentHorizontal.LeftOutside;
                break;
            case Right :
                WebChartControl1.Legend.AlignmentHorizontal LegendAlignmentHorizontal.Right;
                break;
            case RightOutside :
                WebChartControl1.Legend.AlignmentHorizontal LegendAlignmentHorizontal.RightOutside;
                break;        
        }
    }
说明框竖直位置控制
  Code
private void PerformVerAligmentAction()
    {
        switch (ddllegendverticalalign.SelectedValue.Trim())
        {
            case Bottom :
                WebChartControl1.Legend.AlignmentVertical LegendAlignmentVertical.Bottom;
                break;
            case BottomOutside :
                WebChartControl1.Legend.AlignmentVertical LegendAlignmentVertical.BottomOutside;
                break;
            case Center :
                WebChartControl1.Legend.AlignmentVertical LegendAlignmentVertical.Center;
                break;
            case Top :
                WebChartControl1.Legend.AlignmentVertical LegendAlignmentVertical.Top;
                break;
            case TopOutside :
                WebChartControl1.Legend.AlignmentVertical LegendAlignmentVertical.TopOutside;
                break;
        }
    }
说明框内容位置控制
  Code
private void PerformDirectionAction()
    {
        switch (ddllegenddirection.SelectedValue.Trim())
        {
            case BottomToTop :
                WebChartControl1.Legend.Direction LegendDirection.BottomToTop;
                break;
            case LeftToRight :
                WebChartControl1.Legend.Direction LegendDirection.LeftToRight;
                break;
            case RightToLeft :
                WebChartControl1.Legend.Direction LegendDirection.RightToLeft;
                break;
            case TopToBottom :
                WebChartControl1.Legend.Direction LegendDirection.TopToBottom;
                break;
        }
    }
说明框最大宽度比例设置
  Code
private void PerformMaxHorPrctgAction()
    {
        WebChartControl1.Legend.MaxHorizontalPercentage int.Parse(ddlmaxhorizontalpercent.SelectedValue.Trim());
    }
说明框最大高度比例设置
  Code
private void PerformMaxVerPrctgAction()
    {
        WebChartControl1.Legend.MaxVerticalPercentage int.Parse(ddlmaxhorizontalpercent.SelectedValue.Trim());
    }
创建第二条X轴 Y轴方法一样省略
  Code
 private void ShowSecondaryAxisX()
    {
        XYDiagram diagram (XYDiagram)WebChartControl1.Diagram;
        //清除diagram的所有第二X轴
        diagram.SecondaryAxesX.Clear();
        //定义一新X轴
        SecondaryAxisX secondaxisx new SecondaryAxisX( axisX
        //找到需要加入第二坐标的线条
        Series serie WebChartControl1.GetSeriesByName(StrSecondSeriese);
        //定义新X轴的标题
        secondaxisx.Title.Text serie.Name Second AxisX
        secondaxisx.Title.Visible true;
        //图标第二X坐标集合中加入该新X轴
        diagram.SecondaryAxesX.Add(secondaxisx);
        //替换默认坐标轴
        ((XYDiagramSeriesViewBase)serie.View).AxisX secondaxisx;
    }
清除第二条X轴 Y轴方法一样省略
  Code
 private void HideSecondaryAxisX()
    {
        XYDiagram diagram (XYDiagram)WebChartControl1.Diagram;
        diagram.SecondaryAxesX.Clear();
    }
改变图形类型
  Code
private void PerformViewTypeAction()
    {
        ViewType viewType ViewType.Line;
        switch (ddlviewtype.SelectedValue.Trim())
        {
            case Lines :
                viewType ViewType.Line;
                break;
            case Step Lines :
                viewType ViewType.StepLine;
                break;
            case Areas :
                viewType ViewType.Area;
                break;
            case Stacked Areas :
                viewType ViewType.StackedArea;
                break;
            case Full-Stacked Areas :
                viewType ViewType.FullStackedArea;
                break;
            case 3D Lines :
                viewType ViewType.Line3D;
                Table5.Visible true;
                break;
            case 3D Step Lines :
                viewType ViewType.StepLine3D;
                Table5.Visible true;
                break;
            case 3D Areas :
                viewType ViewType.Area3D;
                Table5.Visible true;
                break;
            case 3D Stacked Areas :
                viewType ViewType.StackedArea3D;
                Table5.Visible true;
                break;
            case 3D Full-Stacked Areas :
                viewType ViewType.FullStackedArea3D;
                Table5.Visible true;
                break;
            case Spline :
                viewType ViewType.Spline;
                break;
            case Spline Area :
                viewType ViewType.SplineArea;
                break;
            case Stacked Spline :
                viewType ViewType.StackedSplineArea;
                break;
            case Full-Stacked Spline :
                viewType ViewType.FullStackedSplineArea;
                break;
            case Spline 3D :
                viewType ViewType.Spline3D;
                Table5.Visible true;
                break;
            case Spline Area 3D :
                viewType ViewType.SplineArea3D;
                Table5.Visible true;
                break;
            case Stacked Spline 3D :
                viewType ViewType.StackedSplineArea3D;
                Table5.Visible true;
                break;
            case Full-Stacked Spline 3D :
                viewType ViewType.FullStackedSplineArea3D;
                Table5.Visible true;
                break;
        }
        Series serie WebChartControl1.GetSeriesByName(StrSpeSeries);
        serie.ChangeView(viewType);
            byte transparency
            if (serie.View is Area3DSeriesView || serie.View is AreaSeriesView || serie.View is SplineAreaSeriesView)
            {
                transparency 135;
            }
            ITransparableView transparableView serie.View as ITransparableView;
            if (transparableView ! null)
                transparableView.Transparency transparency;
}
控制3D效果时图形的透明度
  Code
private void PerformTransparencyAction()
    {
        byte byttransparency Convert.ToByte(ddlTransparency.SelectedValue.Trim());
        Diagram3D diagram3D WebChartControl1.Diagram as Diagram3D;
        if (diagram3D ! null)
        {
            for (int i i WebChartControl1.Series.Count; i )
            {
                if (WebChartControl1.Series[i].View is Area3DSeriesView)
                {
                    ((Area3DSeriesView)WebChartControl1.Series[i].View).Transparency byttransparency;
                }
                else if (WebChartControl1.Series[i].View is AreaSeriesView)
                {
                    ((AreaSeriesView)WebChartControl1.Series[i].View).Transparency byttransparency;
                }
                else if (WebChartControl1.Series[i].View is SplineAreaSeriesView)
                {
                    ((SplineAreaSeriesView)WebChartControl1.Series[i].View).Transparency byttransparency;
                }
                else if (WebChartControl1.Series[i].View is Line3DSeriesView)
                {
                    ((Line3DSeriesView)WebChartControl1.Series[i].View).Transparency byttransparency;
                }
                else if (WebChartControl1.Series[i].View is Bar3DSeriesView)
                {
                    ((Bar3DSeriesView)WebChartControl1.Series[i].View).Transparency byttransparency;
                }
            }
        }
    }
控制3D效果时图形视觉角度
  Code
private void PerformPerspectiveAngleAction()
    {
        byte byttransparency Convert.ToByte(ddlTransparency.SelectedValue.Trim());
        Diagram3D diagram3D WebChartControl1.Diagram as Diagram3D;
        diagram3D.PerspectiveAngle int.Parse(ddlperspectiveangle.SelectedValue.Trim());
    }
 导出打印相关
  Code
dxm:ASPxMenu SkinID ChartDemoToolbar ID mnuToolbar runat server ClientInstanceName mnuToolbar ApplyItemStyleToTemplates True
        Items
            dxm:MenuItem Name mnuPrint Text ToolTip 打印该图表
                Image Url ~/Images/Toolbar/BtnPrint.png /
            /dxm:MenuItem
            dxm:MenuItem Name mnuSaveToDisk Text ToolTip 导出图表并保存 BeginGroup True
                Image Url ~/Images/Toolbar/BtnSave.png /
            /dxm:MenuItem
            dxm:MenuItem Name mnuSaveToWindow Text ToolTip 在线打开图表
                Image Url ~/Images/Toolbar/BtnSaveWindow.png /
            /dxm:MenuItem
            dxm:MenuItem Name mnuFormat Template
                dxe:ASPxComboBox runat server Width 60px ValueType System.String ID cbFormat SelectedIndex 0 ClientInstanceName cbFormat
                    Items
                        dxe:ListEditItem Value pdf Text pdf /
                        dxe:ListEditItem Value xls Text xls /
                        dxe:ListEditItem Value png Text png /
                        dxe:ListEditItem Value jpeg Text jpeg /
                        dxe:ListEditItem Value bmp Text bmp /
                        dxe:ListEditItem Value tiff Text tiff /
                        dxe:ListEditItem Value gif Text gif /
                    /Items
                /dxe:ASPxComboBox
            /Template /dxm:MenuItem
            
        /Items
        ClientSideEvents ItemClick function(s, e) {
    if (e.item.name mnuPrint )
        chart.Print();
    if (e.item.name mnuSaveToDisk )
        chart.SaveToDisk(cbFormat.GetText());
    if (e.item.name mnuSaveToWindow )
        chart.SaveToWindow(cbFormat.GetText());
} /
    /dxm:ASPxMenu 点赞 评论 1