Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/kubernetes/5.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 缩放d3时间轴的更好方法_Javascript_D3.js - Fatal编程技术网

Javascript 缩放d3时间轴的更好方法

Javascript 缩放d3时间轴的更好方法,javascript,d3.js,Javascript,D3.js,我正试图用D3.js画一条线。它们是在一段时间内每隔一段时间采集的样本。我想用x的时间轴来画它们。每个数据点只是数组中的一个索引,我不知道如何设置轴,这样在调用d3.time.scale之前就不必手动重新缩放轴 有人知道如何清理水垢吗 我的代码片段。我的实际代码下载数据,并在不同的时间段绘制大量线,在图中转换不同的偏移量 // input data var start_time = 1352684763; var end_time = 1352771163; // data is exactly

我正试图用D3.js画一条线。它们是在一段时间内每隔一段时间采集的样本。我想用x的时间轴来画它们。每个数据点只是数组中的一个索引,我不知道如何设置轴,这样在调用d3.time.scale之前就不必手动重新缩放轴

有人知道如何清理水垢吗

我的代码片段。我的实际代码下载数据,并在不同的时间段绘制大量线,在图中转换不同的偏移量

// input data
var start_time = 1352684763;
var end_time = 1352771163;
// data is exactly 100 samples taken between start_time and end_time
var data = [140,141,140,140,139,140,140,140,140,141,139,140,54,0,0,0,0,0,0,0,0,0...]
var y_max = d3.max(data);

// graph
var scale_x = d3.time.scale().domain([start_time, end_time]).range([0, 100]);
var scale_y = d3.scale.linear().domain([0, y_max]).range([height, 0]);
var step = (end_time - start_time)/100;
function re_scale(x) { return start_time + x*step; }

// for x, rescale i (0..99) into a timestamp between start_time and end_time before returning it and letting scale_x scale it to a local position. Awkward.
var line = d3.svg.line()
    .x(function(d, i) { return scale_x(re_scale(i)); })
    .y(scale_y)
    .interpolate('basis')

var g = graph.selectAll("g")
    .append('svg:path')
    .attr('d', function(d) { return line(data); })

// also draw axis here...

域应指数据中的范围,范围应指屏幕上的范围

目前,它将把scale_x上的.range[01100]解释为像素数。如果将其更改为.range[0,width],则无需重新缩放即可工作

d3.time.scale只需知道起点和终点即可生成一个良好的轴。但是,如果您确实希望为每个数据点打勾,则在中可以选择这样做