javascript - 为什么将这些立体主义视界图压向左侧？

我正在从Graphite加载指标，但是当它们在地平线图上呈现时，它们将被压缩在图的左侧，而不是占用整个图空间的整个宽度。这是显示我的意思的屏幕截图:

该数据来自我要求的3小时窗口。这是最顶层视界图的一些石墨输出:

,1347632400,1347643200,60|892.0,526.0,371.0,1475.0,1234.0 [...] 1250.0,1604.0,1146.0,965.0

很难从图像中分辨出来，但是这些值确实与绘制的内容一致。只是他们没有占用所有空间。

该图表被绘制成一个简单的<div id="#graphs">，该属性仅具有CSS属性的position: relative和width: 1080px;。这是立体主义JavaScript:

var context = cubism.context()
    .step(1e4)
    .size(1080);  // 3 hours

var graphite = context.graphite("http://graphite.example.com");
var horizon = context.horizon().metric(graphite.metric).height(100);

var metrics = [
    "prod.counts.total_stats",
    "stage.counts.total_stats",
    "dev.counts.total_stats"
]

d3.select("#graphs").append("div")
    .attr("class", "axis")
    .call(context.axis().ticks(12).orient("top"));

d3.select("#graphs").append("div")
    .attr("class", "rule")
    .call(context.rule());

d3.select("#graphs").selectAll(".horizon")
    .data(metrics)
  .enter().append("div")
    .attr("class", "horizon")
    .call(horizon);

CSS的其余部分几乎是从stocks demo复制粘贴的。为了简洁起见，我将不包括在内，但如有必要，我可以包括在内。

最佳答案

参见issue 20:



您可以通过在Graphite中存储更高分辨率的数据或说出summary(metric，“10s”)来解决此问题。

关于javascript - 为什么将这些立体主义视界图压向左侧？，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/12429311/