vis.js在2dgraph中获取Y值

时间:2017-09-07 14:59:25

标签: javascript cursor axis vis.js

我正在使用vis.js来显示某些数据集,例如2dgraph:

var data_lat=[
{x:'2016-02-05T07:58:49.257',y:48.66081132,group:0},
{x:'2016-02-05T07:58:51.257',y:48.66081132,group:0},
...

我用

在该图表上放置了一个可拖动的光标
graph_lat.addCustomTime(time[0].t, '1');

我会根据光标的位置显示y的curent值。

我看过vis.js doc,但我没找到任何东西

/ /编辑回答/ /

这是我为获取y值而创建的函数BUT:仅适用于只有一个组的数组

function closest (time, arr) {
var mid, time_mid;
var lo = 0;
var hi = arr.length - 1;
var time_number=moment(time).format('x');
//console.log(time_number);
while (hi - lo > 1) {
    mid = Math.floor ((lo + hi) / 2);
    time_mid=moment(arr[mid].x).format('x');
    if (time_mid < time_number) {
        lo = mid;
    } else {
        hi = mid;
    }
}
if (time_number - moment(arr[lo].x).format('x') <= moment(arr[hi].x).format('x') - time_number) {
    return arr[lo].y;
}
return arr[hi].y;

}

这里是一个包含许多组的数组(对于一个y值就像许多x一样),就像这个数组一样:

{x:'2016-02-05T07:58:49.257',y:0,group:8},
{x:'2016-02-05T07:58:49.257',y:0,group:9},
{x:'2016-02-05T07:58:49.257',y:0,group:10},
{x:'2016-02-05T07:58:49.257',y:0,group:11},
{x:'2016-02-05T07:58:51.257',y:9,group:8},
{x:'2016-02-05T07:58:51.257',y:6,group:9},
{x:'2016-02-05T07:58:51.257',y:0,group:10},
{x:'2016-02-05T07:58:51.257',y:15,group:11},
{x:'2016-02-05T07:58:53.257',y:9,group:8}

function closest_multi_group (time, arr, groupID) {
var mid, time_mid;
var lo = 0;
var hi = arr.length - 1;
var time_number=moment(time).format('x');
//console.log(time_number);
while (hi - lo > 1) {
    mid = Math.floor ((lo + hi) / 2);
    time_mid=moment(arr[mid].x).format('x');
    if (time_mid < time_number) {
        lo = mid;
    } else {
        hi = mid;
    }
}
console.log((time_number - moment(arr[lo].x).format('x'))+'<='+(moment(arr[hi].x).format('x') - time_number));
if (time_number - moment(arr[lo].x).format('x') <= moment(arr[hi].x).format('x') - time_number) {
    console.log(arr[lo]);

    if(arr[lo+1].group < arr[lo].group){
        while(arr[lo].group!=groupID){

            lo--;
            console.log('lo-- '+lo);
        }
    }
    else{
        while(arr[lo].group!=groupID){

            lo++;
            console.log('lo++ '+lo);
        }
    }
    return arr[lo].y;
}

if(arr[hi-1].group > arr[hi].group){
    console.log(arr[hi]);
    while(arr[hi].group!=groupID){

        hi++;
        console.log('hi++ '+hi);
    }
}
else{
    console.log(arr[hi]);
    while(arr[hi].group!=groupID){

        hi--;
        console.log('hi-- '+hi);
    }
}
return arr[hi].y;
}

1 个答案:

答案 0 :(得分:1)

事件timechange为您提供拖动时自定义时间栏的当前时间。那是你的x。在这段时间内,您可以遍历data_lat以查找距x最近的数据点,并在某处显示相应的y值。