Question

我已经使用D3大约一年了，而且我过去制作仪表板没有问题。然而，这次我在路上遇到了一个相当奇怪的颠簸。我有一个带有topo JSON的地理仪表板和一个水平条形图，可以在我的gist / block中找到：

http://bl.ocks.org/diggetybo/77469aa2acec38f1870197724ea671d6

注意你可能要点击查看完整的视图窗口，块网站似乎将iframe高度设置为500.（你可以忽略除index.html之外的所有文件，其他文件只是源代码，我的tsv数据文件）

过去，我的典型仪表板技术是为仪表板的每个图形分配一个单独的div。然而，这里的问题是，应该在美国地图下可见水平条。但是，尽管有很多修补，但不会显示水平条。我仍然以同样的方式添加它们 - 它在过去一直对我有效。所以基本上，我不确定为什么没有显示水平条形图。

开发人员工具报告根本没有错误 - 这很奇怪。我可以清楚地看出有什么问题，因为我的仪表板有一半丢失了。

我在index.html中添加了注释，以指示代码的条形图部分的位置。具体而言，行：159-228。

为了以防万一，概念性地阐明水平条形图“正在做什么”也可能会有所帮助。它应该从一个变量中追加rects，该变量将我的解析数据从最大值排序到最小值（在我的tsv中为d.fxb），并根据线性色标给出填充。

更新

我已经关闭了样式调用，现在我在解决其他错误时遇到了麻烦。可悲的是，我陷入了代码条形图部分的第一行。第160行。我更新了要点，我将在此处包含相关的行以供参考：

var values = data.fxb.sort(function(a, b) {
    return -(a - b);
});

var name_value_array = json.features.name;


var name_values = name_value_array.sort(function(a, b) {

    return -(a.value - b.value);

});

我收到的错误是：“无法读取未定义的属性”排序。据我所知，应该定义数组。这次我非常小心确保所有内容都包含在正确的{{ 1}}令牌。我三重检查以确保这些行仍被数据解析功能所包围。所以我不确定为什么会发生这种情况。我确实相信条形码代码的底部，所以如果有人可以发现什么阻碍了我，我将非常感激。

谢谢

Answer 1

这不会解决您的所有问题，但您未能关闭此style call。

.style("fill", function(d) {
  // Get data value
  var value = d.properties.fxb;
  if (value=='None') {
    return "#999999"
  }
  if (value) {
  //If value exists…
    return color(value);
  } else {
    //If value is undefined…
    return "#999999";
  }

您最后还会在脚本底部添加额外的});（style调用最终会被关闭）

还有更多的错误，但是它们正在吞噬它们以及它们没有出现的原因。

未显示D3部分仪表板

1 个答案: