xChart demo -- line

//chart的数据格式，xChart中所有的图表数据格式都是这样的二维数组，
//第一行是表头。
var data= [
            ["xfield","uv" ,"pv" ,"click", "ppc"],
            [ 1      , 1 , 100  , 233    , 0.2],
            [ 2      , 2  , 51  , 326    , 0.5],
            [ 3      , 3 , 50  , 550    , 0.8],
            [ 4      , 4 , 60  , 533    , 0.4],
            [ 5      , 5  , 91  , 3126   , 0.22 ],
            [ 6      , 6  , 50 , 290     , 0.35],
            [ 7      , 6  , 96 , 233    , 0.91],
            [ 8      , 7  , 51  , 386    , 0.1],
            [ 9      , 8 , 90  , 150   , 0.34 ]
                
        ];

/*
var data = [
    { xfield : 1, uv: null, pv: undefined, click: null },
    { xfield : 2, uv: 0, pv: "", click: ""},
    { xfield : 3, uv: 23, pv: 145, click : undefined },
    { xfield : 4, uv : 232, pv: 32, click : 123 },
    { xfield : 5, uv : 232, pv: 123, click : 63 },
    { xfield : 6, uv : 43, pv: 213, click : 42 },
    { xfield : 7, uv : 23, pv: 152, click : 62 },
    { xfield : 8, uv : 122, pv: 53, click : 35 },
    { xfield : 9, uv : 23, pv: 45, click : 103 },
    { xfield : 10, uv : 64, pv: 75, click : 74 },
    { xfield : 11, uv : 212, pv: 74, click : 43 },
    { xfield : 12, uv : undefined, pv: 19, click : 7 }
]
*/

var options = {
    coord : {
        type : "box",
        //横向的图表，是坐标系横向了
        //horizontal : true,

xAxis : {
            field : "xfield",
            label:{
                rotation  : 30 
            }
        },
        yAxis : [
            {
                name : "pv",
                middleweight:[8,100]
            }

],
        zAxis:{
            dataSection:["点击率","点击,成交","页面访问数"]
        },
        controls:{
            autoRotate:false 
        }
    },
    graphs : [
        { 
            type : "line",
            field : ["uv"] , 
            yAxisName:"pv" ,
            fill : {
                alpha : [ 0.5 , 0 ]
            },
            node : {
                //配置拐点才出现节点
                corner : true
            },
            label : {
                enabled : true
            }
        },{ 
            type : "line",
            field : ["pv"] , 
            yAxisName:"pv" ,
            fill : {
                alpha : [ 0.5 , 0 ]
            },
            node : {
                //配置拐点才出现节点
                corner : true
            },
            label : {
                enabled : true
            }
        },{ 
            type : "line",
            field : ["click"] , 
            yAxisName:"pv" ,
            fill : {
                alpha : [ 0.5 , 0 ]
            },
            node : {
                //配置拐点才出现节点
                corner : true
            },
            label : {
                enabled : true
            }
        }

]
      
};

window.line = Chartx3d.create("canvasTest" , data , options)

折线图（bar chart）

联系人：@不决