如何用标签绘制垂直线?

时间:2017-04-01 08:10:34

标签: javascript jsp charts

我试图根据垂直虚线绘制xAxis  看看下面的代码(Java Script)?

     option = {
    title : {
        text: '双数值轴折线',
        subtext: '纯属虚构'
    },
    tooltip : {
        trigger: 'axis',
        axisPointer:{
            show: true,
            type : 'cross',
            lineStyle: {
                type : 'dashed',
                width : 1
            }
        },
        formatter : function (params) {
            return params.seriesName + ' : [ '
                   + params.value[0] + ', ' 
                   + params.value[1] + ' ]';
        }
    },
      dataRange: {
        min : 0,
        max : 100,
        calculable : true,
        color: ['#ff3333', 'orange', 'yellow','lime','aqua'],
        textStyle:{
            color:'#fff'
        }
    },
  dataZoom:{
    realtime:true,
    show:true,
    y:45,
    height:20
  },
    legend: {
        data:['数据1','数据2']
    },
    toolbox: {
        show : true,
        feature : {
            mark : {show: true},
            dataZoom : {show: true},
            dataView : {show: true, readOnly: false},
            magicType : {show: true, type: ['line', 'bar']},
            restore : {show: true},
            saveAsImage : {show: true}
        }
    },
    calculable : true,
    xAxis : [
        {
            type: 'value'
        }
    ],
    yAxis : [
        {
            type: 'value',
            axisLine: {
                lineStyle: {
                    color: '#dc143c'
                }
            }

        }
    ],
    series : [
        {
            name:'test',
            type:'line',
            data:[ 
               [1.5, 10], [5, 7], [8, 8], [12, 6], [11, 12], [16, 9], [14, 6], [17, 4], [19, 9]
            ],

            markLine : {
                            label: {
            normal: {
                show: true
            }
        },
                  lineStyle: {
            normal: {
                type: "dotted",
                color: "red"
            }
        },
                data : [

                 [{name:'tos',xAxis:10,yAxis:0},
                  {name:'ecs',xAxis:10,yAxis:10}],

                  [{name:'tos',xAxis:15,yAxis:0},
                   {name:'ecs',xAxis:15,yAxis:15}],

                  [{name:'tos',xAxis:20,yAxis:0},
                   {name:'ecs',xAxis:20,yAxis:20}],

                  [{name:'tos',xAxis:3,yAxis:0},
                   {name:'ecs',xAxis:3,yAxis:3}],

               ]
            }
        }
    ]
};
  

类似的东西:

http://www.fusioncharts.com/dev/assets/images/vertical_lines.png.pagespeed.ce.JPDT_Ecw2V.png

0 个答案:

没有答案
相关问题