vis.js 获取二维图中的 Y 值
vis.js Get Y value in a 2dgraph
我正在使用 vis.js 在 2d 图上显示一些数据集:
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 的当前值。
我已经查看了 vis.js 文档,但我没有找到任何东西
//编辑回答//
这是我创建的用于获取 y 值的函数但是:仅适用于其中只有一个组的数组
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;
}
事件timechange
为您提供自定义时间栏被拖动时的当前时间。那就是你的x
。这次,您可以遍历 data_lat
以找到最接近 x
的数据点,并在某处显示相应的 y
值。
我正在使用 vis.js 在 2d 图上显示一些数据集:
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 的当前值。
我已经查看了 vis.js 文档,但我没有找到任何东西
//编辑回答//
这是我创建的用于获取 y 值的函数但是:仅适用于其中只有一个组的数组
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;
}
事件timechange
为您提供自定义时间栏被拖动时的当前时间。那就是你的x
。这次,您可以遍历 data_lat
以找到最接近 x
的数据点,并在某处显示相应的 y
值。