1. 程式人生 > >【echarts應用】--橫軸每五分鐘取一個點,動態時間軸實現

【echarts應用】--橫軸每五分鐘取一個點,動態時間軸實現

需求:折線圖需要定點時間(例如五分鐘)取一個點,在一段範圍內(昨天的某個時間點到目前時間或者今天凌晨12點到目前的時間點),這種動態生成的時間軸。

以下以從當天的十二點開始,到當前時間點為止(五分鐘以及其他時間一個道理)的demo

推薦一個很好用的獲取時間以及改變想要的時間格式的外掛moment.js(http://momentjs.cn/

1.封裝

function timeControl() {
    timeArr = []
    var startTime = new Date(
        new Date(new Date().toLocaleDateString()).getTime()
    ).getTime()           //當天凌晨十二點               

    var endTime = timeFormat(moment().format('YYYY-MM-DD HH:mm:ss'))  //moment.js獲取的現在的時間點

    var timerange = endTime - startTime
    var count = Math.floor(timerange / (60 * 60 * 1000))  //時間間隔 (五分鐘:5*60*1000)
    console.log(count)
    for (var i = 0; i <= count; i++) {
        var modTine = moment(startTime + (60 * 60 * 1000) * i).format('YYYY-MM-DD HH:mm')
        timeArr.push(modTine)
    }
    if (startTime + count * (60 * 60 * 1000) !== endTime) {
        timeArr.push(moment().format('YYYY-MM-DD HH:mm:ss'))
    }
}

function timeFormat(time) {             //時間格式封裝
    var changetime = time.replace(new RegExp("-", "gm"), "/")
    return (new Date(changetime)).getTime()
}

呼叫

var timeArr=[]
timeControl()