Echarts圖表座標軸動態展示兩個時間點之間的時間

初始折線圖樣式

以下是配置項設定：

option = {
    xAxis: {
        type: 'category',
        data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        data: [820, 932, 901, 934, 1290, 1330, 1320],
        type: 'line'
 

    }]
};

更改後折線圖樣式

圖中所示，X軸的座標的時間是可以根據你返回的資料動態調節的，時間資料間隔長，頁面上也會對應顯示相應的間隔 ，不會因為沒有資料而影響。

更改之後的配置項配置：

option = {
    xAxis: {
        type: 'time',
    },
    yAxis: {
        type: 'value'
    },
    series: [{
        data: [                            
                {
                    "value"
 
: [
                        "2018-10-11",
                        4
                    ]
                },
                {
                    "value": [
                        "2018-10-12",
                        4
                    ]
                },
                
                {
                    "value"
 
: [
                        "2018-10-15",
                        4
                    ]
                },
                {
                    "value": [
                        "2018-10-16",
                        4
                    ]
                },
                {
                    "value": [
                        "2018-10-18",
                        1
                    ]
                },
                {
                    "value": [
                        "2018-10-19",
                        1
                    ]
                },
                {
                    "value": [
                        "2018-10-20",
                        1
                    ]
                },
                
                {
                    "value": [
                        "2018-10-24",
                        1
                    ]
                },
                
                
                {
                    "value": [
                        "2018-10-30",
                        1
                    ]
                },
                {
                    "value": [
                        "2018-10-31",
                        1
                    ]
                },
                {
                    "value": [
                        "2018-11-01",
                        1
                    ]
                },
                {
                    "value": [
                        "2018-11-23",
                        -12.96
                    ]
                }
            ],
        type: 'line'
    }]
};