时间轴

描述:当前是关于Echarts图表中的 折线图 示例。
 
            option = {
    xAxis: {
        type: 'category',
        data: ["1995-01-12","2013-06-09","2018-03-16","2018-05-23","2018-08-01","2019-08-12","2019-10-28","2020-01-02"],
        axisLabel:{show: false},
        axisLine:{
            lineStyle:{ 
                type: 'dotted'
            }
        },
        axisTick:{
            show:false,
        }
    },
    yAxis: {
        type: 'value',
        axisLine: {show: false},
        axisLabel: {show: false},
        axisTick: {show: false},
        splitLine: {show: false},
    },
    dataZoom: [ {
        type: 'slider',
        xAxisIndex: [0, 0],
        start: 0,
        end: 100,
        height: 20,
        left:75,
        right:78,
        bottom: 0,
        handleIcon: 'path://M159.336,430.669v-24.834h30.493v24.834l-15.248,8.544L159.336,430.669z',
        handleSize: '100%',
        handleStyle: {
            color: '#D5DBE4',
            borderWidth: 2,
            borderColor:"#FFF",
            shadowBlur: 8,
            shadowColor: '#fff',
        },
    },{
        type: 'inside',
        xAxisIndex: [0, 0],
        start: 0,
        end: 100,
        bottom: 30,
        height: 20
    }],
    series: [{
        type: 'line',
        markPoint : {
            symbol:'path://M213.285,0h-0.608C139.114,0,79.268,59.826,79.268,133.361c0,48.202,21.952,111.817,65.246,189.081 c32.098,57.281,64.646,101.152,64.972,101.588c0.906,1.217,2.334,1.934,3.847,1.934c0.043,0,0.087,0,0.13-0.002 c1.561-0.043,3.002-0.842,3.868-2.143c0.321-0.486,32.637-49.287,64.517-108.976c43.03-80.563,64.848-141.624,64.848-181.482 C346.693,59.825,286.846,0,213.285,0z M274.865,136.62c0,34.124-27.761,61.884-61.885,61.884 c-34.123,0-61.884-27.761-61.884-61.884s27.761-61.884,61.884-61.884C247.104,74.736,274.865,102.497,274.865,136.62z',//标记类型
            symbolSize: 40,//图形大小
            symbolOffset:[0, -30],
            symbolKeepAspect:true,
            itemStyle: {
                    borderColor: '#FFF',
                    borderWidth: 4,            // 标注边线线宽,单位px,默认为1
            },
            emphasis:{
                label:{
                    distance : 10
                }
            },
            data : [
            {
                "value":"1995-01-12",
                "xAxis":0,
                "yAxis":0,
                "symbolSize":20,
                "symbolOffset":[
                    0,
                    -30
                ],
                "label":{
                    "distance":5,
                    "fontSize":8,
                    "position":"top",
                    "color":"#000",
                    "fontWeight":"bold"
                },
                "itemStyle":{
                    "color":"#FD691C",
                    "borderWidth":3,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"1995-01-12",
                "xAxis":0,
                "yAxis":0,
                "symbol":"path://M959.846 509.535c0 247.319-200.527 447.846-447.846 447.846l0 0c-247.378 0-447.846-200.527-447.846-447.846l0 0c0-247.319 200.467-447.846 447.846-447.846l0 0c247.319 0 447.846 200.527 447.846 447.846l0 0z",
                "symbolSize":15,
                "symbolOffset":[
                    0,
                    0
                ],
                "label":{
                    "show":false
                },
                "itemStyle":{
                    "color":"#FD691C",
                    "borderWidth":5,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2013-06-09",
                "xAxis":1,
                "yAxis":0,
                "symbolSize":20,
                "symbolOffset":[
                    0,
                    -30
                ],
                "label":{
                    "distance":5,
                    "fontSize":8,
                    "position":"top",
                    "color":"#000",
                    "fontWeight":"bold"
                },
                "itemStyle":{
                    "color":" #9C50F7",
                    "borderWidth":3,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2013-06-09",
                "xAxis":1,
                "yAxis":0,
                "symbol":"path://M959.846 509.535c0 247.319-200.527 447.846-447.846 447.846l0 0c-247.378 0-447.846-200.527-447.846-447.846l0 0c0-247.319 200.467-447.846 447.846-447.846l0 0c247.319 0 447.846 200.527 447.846 447.846l0 0z",
                "symbolSize":15,
                "symbolOffset":[
                    0,
                    0
                ],
                "label":{
                    "show":false
                },
                "itemStyle":{
                    "color":" #9C50F7",
                    "borderWidth":5,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2018-03-16",
                "xAxis":2,
                "yAxis":0,
                "symbolSize":20,
                "symbolOffset":[
                    0,
                    -30
                ],
                "label":{
                    "distance":5,
                    "fontSize":8,
                    "position":"top",
                    "color":"#000",
                    "fontWeight":"bold"
                },
                "itemStyle":{
                    "color":"#FD691C",
                    "borderWidth":3,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2018-03-16",
                "xAxis":2,
                "yAxis":0,
                "symbol":"path://M959.846 509.535c0 247.319-200.527 447.846-447.846 447.846l0 0c-247.378 0-447.846-200.527-447.846-447.846l0 0c0-247.319 200.467-447.846 447.846-447.846l0 0c247.319 0 447.846 200.527 447.846 447.846l0 0z",
                "symbolSize":15,
                "symbolOffset":[
                    0,
                    0
                ],
                "label":{
                    "show":false
                },
                "itemStyle":{
                    "color":"#FD691C",
                    "borderWidth":5,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2018-05-23",
                "xAxis":3,
                "yAxis":0,
                "symbolSize":60,
                "symbolOffset":[
                    0,
                    -50
                ],
                "label":{
                    "distance":5,
                    "fontSize":16,
                    "position":"top",
                    "color":"#000",
                    "fontWeight":"bold"
                },
                "itemStyle":{
                    "color":"#6DCFF6",
                    "borderWidth":3,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2018-05-23",
                "xAxis":3,
                "yAxis":0,
                "symbol":"path://M959.846 509.535c0 247.319-200.527 447.846-447.846 447.846l0 0c-247.378 0-447.846-200.527-447.846-447.846l0 0c0-247.319 200.467-447.846 447.846-447.846l0 0c247.319 0 447.846 200.527 447.846 447.846l0 0z",
                "symbolSize":15,
                "symbolOffset":[
                    0,
                    0
                ],
                "label":{
                    "show":false
                },
                "itemStyle":{
                    "color":"#6DCFF6",
                    "borderWidth":5,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2018-08-01",
                "xAxis":4,
                "yAxis":0,
                "symbolSize":20,
                "symbolOffset":[
                    0,
                    -30
                ],
                "label":{
                    "distance":5,
                    "fontSize":8,
                    "position":"top",
                    "color":"#000",
                    "fontWeight":"bold"
                },
                "itemStyle":{
                    "color":"#FD691C",
                    "borderWidth":3,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2018-08-01",
                "xAxis":4,
                "yAxis":0,
                "symbol":"path://M959.846 509.535c0 247.319-200.527 447.846-447.846 447.846l0 0c-247.378 0-447.846-200.527-447.846-447.846l0 0c0-247.319 200.467-447.846 447.846-447.846l0 0c247.319 0 447.846 200.527 447.846 447.846l0 0z",
                "symbolSize":15,
                "symbolOffset":[
                    0,
                    0
                ],
                "label":{
                    "show":false
                },
                "itemStyle":{
                    "color":"#FD691C",
                    "borderWidth":5,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2019-08-12",
                "xAxis":5,
                "yAxis":0,
                "symbolSize":60,
                "symbolOffset":[
                    0,
                    -50
                ],
                "label":{
                    "distance":5,
                    "fontSize":16,
                    "position":"top",
                    "color":"#000",
                    "fontWeight":"bold"
                },
                "itemStyle":{
                    "color":"#6DCFF6",
                    "borderWidth":3,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2019-08-12",
                "xAxis":5,
                "yAxis":0,
                "symbol":"path://M959.846 509.535c0 247.319-200.527 447.846-447.846 447.846l0 0c-247.378 0-447.846-200.527-447.846-447.846l0 0c0-247.319 200.467-447.846 447.846-447.846l0 0c247.319 0 447.846 200.527 447.846 447.846l0 0z",
                "symbolSize":15,
                "symbolOffset":[
                    0,
                    0
                ],
                "label":{
                    "show":false
                },
                "itemStyle":{
                    "color":"#6DCFF6",
                    "borderWidth":5,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2019-10-28",
                "xAxis":6,
                "yAxis":0,
                "symbolSize":60,
                "symbolOffset":[
                    0,
                    -50
                ],
                "label":{
                    "distance":5,
                    "fontSize":16,
                    "position":"top",
                    "color":"#000",
                    "fontWeight":"bold"
                },
                "itemStyle":{
                    "color":"#6DCFF6",
                    "borderWidth":3,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2019-10-28",
                "xAxis":6,
                "yAxis":0,
                "symbol":"path://M959.846 509.535c0 247.319-200.527 447.846-447.846 447.846l0 0c-247.378 0-447.846-200.527-447.846-447.846l0 0c0-247.319 200.467-447.846 447.846-447.846l0 0c247.319 0 447.846 200.527 447.846 447.846l0 0z",
                "symbolSize":15,
                "symbolOffset":[
                    0,
                    0
                ],
                "label":{
                    "show":false
                },
                "itemStyle":{
                    "color":"#6DCFF6",
                    "borderWidth":5,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2020-01-02",
                "xAxis":7,
                "yAxis":0,
                "symbolSize":20,
                "symbolOffset":[
                    0,
                    -30
                ],
                "label":{
                    "distance":5,
                    "fontSize":8,
                    "position":"top",
                    "color":"#000",
                    "fontWeight":"bold"
                },
                "itemStyle":{
                    "color":" #9C50F7",
                    "borderWidth":3,
                    "borderColor":"#fff"
                }
            },
            {
                "value":"2020-01-02",
                "xAxis":7,
                "yAxis":0,
                "symbol":"path://M959.846 509.535c0 247.319-200.527 447.846-447.846 447.846l0 0c-247.378 0-447.846-200.527-447.846-447.846l0 0c0-247.319 200.467-447.846 447.846-447.846l0 0c247.319 0 447.846 200.527 447.846 447.846l0 0z",
                "symbolSize":15,
                "symbolOffset":[
                    0,
                    0
                ],
                "label":{
                    "show":false
                },
                "itemStyle":{
                    "color":" #9C50F7",
                    "borderWidth":5,
                    "borderColor":"#fff"
                }
            }
        ]},
    }]
};