OWC 的应用 - 柱状图(VB.NET 和 JavaScript)

用OWC做统计图总结

VB.NET

        '创建ChartSpace对象来放置图表

        Dim myChart As ChartSpaceClass = New ChartSpaceClass

        '在ChartSpace对象中添加图表，Add方法返回chart对象

        Dim Chart1 As ChChart = myChart.Charts.Add(0)

        '指定图表的类型。类型由OWC.ChartChartTypeEnum枚举值得到

        Chart1.Type = OWC10.ChartChartTypeEnum.chChartTypeColumnClustered



        '指定图表是否需要图例

        Chart1.HasLegend = True

        Chart1.Legend.Position = ChartLegendPositionEnum.chLegendPositionTop



        '给定标题

        Chart1.HasTitle = True

        Chart1.Title.Caption = "1-6月数据分布图"



        '计算数据

        'X轴

        Dim strCategory As String = "1" + ControlChars.Tab + "2" + ControlChars.Tab _

                                 + "3" + ControlChars.Tab + "4" + ControlChars.Tab + "5" + ControlChars.Tab _

                                 + "6" + ControlChars.Tab

        'Y轴

        Dim strValue As String = "9" + ControlChars.Tab + "8" + ControlChars.Tab _

                                 + "4" + ControlChars.Tab + "10" + ControlChars.Tab + "12" + ControlChars.Tab _

                                 + "6" + ControlChars.Tab

        'Z轴

        Dim strValue2 As String = "0.3" + ControlChars.Tab + "0.63" + ControlChars.Tab _

                                  + "0.48" + ControlChars.Tab + "0.86" + ControlChars.Tab + "0.95" + ControlChars.Tab _

                                  + "0.18" + ControlChars.Tab





        '1. 添加一个series

        Dim Ser1 As ChSeries = Chart1.SeriesCollection.Add(0)

        '给定series的名字

        Ser1.SetData(ChartDimensionsEnum.chDimSeriesNames, _

                                           ChartSpecialDataSourcesEnum.chDataLiteral, "Product")

        '给定分类

        Ser1.SetData(ChartDimensionsEnum.chDimCategories, _

                                           ChartSpecialDataSourcesEnum.chDataLiteral, strCategory)

        '给定值

        Ser1.SetData(ChartDimensionsEnum.chDimValues, _

                                           ChartSpecialDataSourcesEnum.chDataLiteral, strValue)





        '2. 再添加一个series

        Dim Ser2 As ChSeries = Chart1.SeriesCollection.Add(1)

        '给定series的名字

        Ser2.SetData(ChartDimensionsEnum.chDimSeriesNames, _

                                           ChartSpecialDataSourcesEnum.chDataLiteral, "Ratio")

        '给定分类

        Ser2.SetData(ChartDimensionsEnum.chDimCategories, _

                                           ChartSpecialDataSourcesEnum.chDataLiteral, strCategory)

        '给定值

        Ser2.SetData(ChartDimensionsEnum.chDimValues, _

                                           ChartSpecialDataSourcesEnum.chDataLiteral, strValue2)

        Ser2.Ungroup(True)

        Ser2.Type = ChartChartTypeEnum.chChartTypeLineMarkers

        '添加Z轴

        Dim AxesZ As ChAxis = Chart1.Axes.Add(Ser2.Scalings(ChartDimensionsEnum.chDimValues))

        AxesZ.NumberFormat = "0.00%"

        AxesZ.Position = ChartAxisPositionEnum.chAxisPositionRight





        '给定x,y轴的图示说明

        '默认只有X,Y 两个轴

        Chart1.Axes(-3).HasTitle = True

        Chart1.Axes(-3).Title.Caption = "Y 轴 : 数量"

        Chart1.Axes(-2).HasTitle = True

        Chart1.Axes(-2).Title.Caption = "X 轴： 月份"

        AxesZ.HasTitle = True

        AxesZ.Title.Caption = "Z 轴： Ratio"





        '输出成GIF文件.

        Dim strAbsolutePath As String = "C:\Images\" & Format(Date.Now, "yyyyMMddhhmmss") & ".gif"

        myChart.ExportPicture(strAbsolutePath, "GIF", 600, 350)

        Me.Image1.ImageUrl = strAbsolutePath

JavaScript:

<OBJECT id="ChartSpace1" classid="clsid:0002E556-0000-0000-C000-000000000046" VIEWASTEXT></OBJECT>         

<SCRIPT language="javascript"> 

            //写柱状图 

            function body_onload() 

            { 

                var arrD=new Array(); 

                var arrV1=new Array(); 

                var arrV2=new Array(); 

                var arrV3=new Array(); 

                 

                var sParams=""; 

                //sParams=Form1.all.drpProduct.value; 

                 

                //----------------------chart1 by area----------------------------- 

                /**//* 

                var objhttp=new ActiveXObject("Microsoft.XMLHTTP"); 

                var url=""; 

                //url="GetXmlData.aspx?spName=sp_query_ui_areamove&valueString=" + sParams; 

                //objhttp.open("GET",url,false); 

                objhttp.send(); 

                var sXml=objhttp.responseText; 

                */ 

                 

                var sXml=Form1.all.hidXML.value; 

                window.Form1.hidXML.value='';   //得到值后，把 Hidden 对象清空 

                //alert(sXml); 

                //return; 

                var xmlDoc = new ActiveXObject("Msxml2.DOMDocument"); 

                var nodeList; 

                xmlDoc.async = false; 

                xmlDoc.loadXML(sXml); 

                nodeList=xmlDoc.documentElement.selectNodes("//Total"); //这里应该写上DataTable的名称，我的DataTable的名称是"Total" 



                var nCount=nodeList.length;                 

                var sTime=""; 

                if (nCount>0) 

                { 

                    //sTime=nodeList[0].childNodes[3].text; 

                    for (var i=0;i<nCount;i++) 

                    { 

                        arrD[i]=nodeList[i].childNodes[0].text; 

                        arrV1[i]=nodeList[i].childNodes[1].text; 

                        arrV2[i]=nodeList[i].childNodes[2].text; 

                        arrV3[i]=nodeList[i].childNodes[3].text/100; 

                    } 

                } 

                 

                var myChart=Form1.all.ChartSpace1; 

                 

                myChart.Clear();                 

                var a=myChart.Charts.Add(0);   // 就是图对象的实例化 

                var c=myChart.Constants;       //          

                a.Type=c.chChartTypeColumnClustered; 

                 

                //添加 WO 柱状图 

                var cs=a.SeriesCollection.Add(0); 

                cs.Caption="WO"; 

                cs.SetData(c.chDimCategories,c.chDataLiteral,arrD); 

                cs.SetData(c.chDimValues,c.chDataLiteral,arrV1);             

                 

                //添加 Yield Feedback Lot 柱状图 

                cs=a.SeriesCollection.Add(1); 

                cs.Caption="Yield Feedback Lot"; 

                //cs.SetData(c.chDimCategories,c.chDataLiteral,arrD); 

                cs.SetData(c.chDimValues,c.chDataLiteral,arrV2); 

                 

                //添加 Ratio 柱状图 

                cs=a.SeriesCollection.Add(2); 

                cs.Caption="Ratio"; 

                cs.SetData(c.chDimCategories,c.chDataLiteral,arrD); 

                cs.SetData(c.chDimValues,c.chDataLiteral,arrV3); 

                cs.Type=c.chChartTypeLineMarkers; 

                 

                //添加右侧的百分比坐标,其中左侧和下面的坐标默认情况下，已经存在 

                cs.Ungroup(true);     //表明是独立的坐标系统，否则将共用左侧坐标 

                ax=a.Axes.Add(cs.Scalings(c.chDimValues)); 

                ax.NumberFormat="0.00%"; 

                ax.Position=c.chAxisPositionRight; 

                 

                myChart.HasSelectionMarks=true; 

                myChart.AllowFiltering=true; 

                myChart.AllowPropertyToolbox=true; 

                 

                //定义柱状图的坐标系统的意义 

                a.Axes(c.chAxisPositionLeft).HasTitle=true;             //左坐标代表 "Amount" 数量 

                a.Axes(c.chAxisPositionLeft).Title.Caption="Amount"; 

                a.Axes(c.chAxisPositionLeft).Title.Font.Size=8; 

                a.Axes(c.chAxisPositionBottom).HasTitle=true;           //下坐标代表 "Product" 名称 

                a.Axes(c.chAxisPositionBottom).Title.Caption="Month"; 

                a.Axes(c.chAxisPositionBottom).Title.Font.Size=8; 

                a.Axes(c.chAxisPositionRight).HasTitle=true;            //右坐标代表 "Ratio" 比率 

                a.Axes(c.chAxisPositionRight).Title.Caption="Ratio"; 

                a.Axes(c.chAxisPositionRight).Title.Font.Size=8; 

                //a.Axes(c.chAxisPositionRight).MajorUnit=0.1;     



                a.HasLegend=true; 

                a.Legend.Position=c.chLegendPositionTop; 

                //a.HasTitle=true; 

                //a.Title.Caption=" Move Report"; 

                //a.Title.Font.Size=8; 

                    } 

             

        </SCRIPT>