【问题标题】:Cubism: Series Not Rendering, However Getting Numeric Values立体主义:系列不渲染,但获取数值
【发布时间】:2013-04-29 20:02:03
【问题描述】:

尝试使用 Cubism 和 D3 编写简单的可视化。诚然,我对使用 Cubism 和 D3 还很陌生,而且 Cubism 文档很难理解。

轮询 URL 以获取数值以检索“速率”,然后将值推送到示例中的数组中。画布的东西不会呈现,最初,Cubism.js 示例中的数值也不会呈现。过了一会儿,一个数字出现,反映了最新的轮询值。调试 JavaScript 确实会显示随着时间的推移随着值的扩展数组。

任何有助于更好地理解问题的帮助将不胜感激。

render: function() {
  var thatElement = this.el;

  function update(model) {
    var values = [];

    return context.metric(function(start, stop, step, callback) {
      model.fetch();
      var data = model.toJSON();
      if (data[0]) values.push(parseInt(data[0]));
      callback(null, values = values.slice(-context.size()));
    }, "Rate");
  }

  var context = cubism.context()
                .serverDelay(0)
                .clientDelay(0)
                .step(5000);

  var foo = update(this.model);

  d3.select(thatElement).append("div").call(function(div) {
    div.append("div")
      .attr("class", "axis")
      .call(content.axis().orient("top"));

    div.selectAll(".horizon")
        .data([foo])
      .enter().append("div")
        .attr("class", "horizon")
        .call(context.horizon());
    div.append("div")
        .attr("class", "rule")
        .call(context.rule());
  });
}

另外,注意到如果我在其他视图中调用 cubism.context() 东西,它会破坏前面的视图。

【问题讨论】:

  • 你确定有 div.selectAll 方法吗?因为我只见过 d3.selectAll。
  • 我想通了。时间序列默认大小为 1440(4 小时,每秒 1 个像素),并且它在封装 div 之外呈现。现在的问题是确定系列的大小,或者至少强制它进行渲染,以使系列消失在左侧而不是右侧。
  • 经过实验,我发现每个数据点一个像素效果最好。

标签: javascript backbone.js d3.js cubism.js


【解决方案1】:

尝试通过在您的基础 HTML 文件中使用“horizo​​​​n”类编写一个 div 元素来调试问题。我也遇到了同样的问题,但执行此 div 操作在几秒钟内解决了它。

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2012-03-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2022-07-30
    • 1970-01-01
    • 2013-11-07
    • 1970-01-01
    相关资源
    最近更新 更多