xChart demo -- bar

//chart的数据格式，xChart中所有的图表数据格式都是这样的二维数组，
                //第一行是表头。
                var data= [
                    ["xfield","uv" ,"pv" ,"click", "ppc","ppd"],
                    [ 1      , 101 , 20  , 33    , 45,  33],
                    [ 2      , 67  , 51  , 26    , 76,54],
                    [ 3      , 130 , 50  , 50    , 45,98],
                    [ 4      , 101 , 60  , 33    , 64,355],
                    [ 5      , 67  , 91  , 126   , 22,56 ],
                    [ 6      , 30  , 50 , 90     , 45,98],
                    [ 7      , 51  , 120 , 33    , 78,235],
                    [ 8      , 67  , 51  , 86    , 234,123],
                    [ 9      , 120 , 90  , 150   , 63, 234]
                
                ];
                var options = {
                    //theme : [],
                    coord : {
                        type : "box",
                        xAxis : {
                            field : "xfield",
                            title : {
                                content : "xAxis"
                            },
                            label : {
                                textAlign : "center",
                                format: function(val){
                                    return val;
                                    //return "x\nodfdfdfdfsdfo"
                                }
                            }
                            
                            //dataSection : [1,3,5,7,9]
                        },
                        controls:{
                            autoRotate:false,  
                            boxWidth:1500,         //空间中X的最大值(最大宽度)  
                            boxHeight:1000,        //空间中Y的最大值(最大高度)  
                            boxDepth:500,         //空间中Z的最大值(最大深度)
     
                            distance:900,        //默认相机距离
                            maxDistance:5000,     //最大相机距离
                            minDistance:300,      //最小相机距离 
                            
                            alpha:20,    //绕X轴旋转
                            beta:40,      //绕Y轴旋转
                         }
                        
                    },
                    
                   tips : {
                        enabled : "true"
                    },
                    graphs : [ 
                        {
                            type : "bar",
                            field : ["ppc" ],
                            node:{
                            shapeType:'cone', //cube  cylinder cone
                           // materialType:'phong' //phong lambert base
                           }
                        },
                        {
                            type : "bar",
                            field : ["uv",["click","pv"] ],
                            yAxisAlign : "left",
                           node:{
                            shapeType:'cylinder', //cube  cylinder cone
                           // materialType:'phong' //phong lambert base
                           }
                        },

{
                            type : "bar",
                            field : ["ppd" ],
                            node:{
                            shapeType:'cube', //cube  cylinder cone
                           // materialType:'phong' //phong lambert base
                        }
                        }
                        
                    ]
                   
                };
                
                window.bar = Chartx3d.create("canvasTest" , data , options)

柱状图（bar chart）

联系人：@不决