0

这是我到目前为止所拥有的：https ://gist.github.com/daluu/fc1cbcab68852ed3c5fa和http://bl.ocks.org/daluu/fc1cbcab68852ed3c5fa。我正在尝试复制 Excel 功能。

该线与基本/原始http://bl.ocks.org/daluu/f58884c24ff893186416中的默认直方图非常吻合。而且我能够以降频对直方图进行排序，尽管这样做，我切换了 x 尺度（从线性到序数）。在这一点上，我似乎无法正确地将线映射到排序的直方图。就视觉表示而言，它应该类似于以下示例：

  • 上面引用的我的要点中的评论中的 Excel 屏幕截图
  • 此 SO 帖子中的帕累托图排序直方图
  • 在这里用 d3 制作的帕累托图（类似于但不完全是排序的直方图）

使剩余部分正常工作的最佳设计方法是什么？我应该从单个 x 刻度开始而不需要从线性切换到序数吗？如果是这样，我不确定如何使用序数比例正确应用直方图布局，或者如何不使用线性 x 比例作为直方图布局的输入源并仍然获得所需的输出。

使用与我到目前为止的代码相同的序数比例，这条线看起来不错，但它不是我期望看到的曲线。

任何帮助表示赞赏。

4

2 回答 2

1

这条线的主要问题是，在对条形图进行排序后，需要重新计算累积分布，或者如果您要使用静态帕累托图，则需要按照目标排序顺序计算累积分布。为此，我创建了一个小函数来进行此计算：

function calcCDF(data){
  data.forEach(function(d,i){
      if(i === 0){
      d.cum = d.y/dataset.length
    }else{
      d.cum = (d.y/dataset.length) + data[i-1].cum
    }
  })
  return data
}

就我而言，我每次都打开/关闭帕累托排序并重新计算 d.cum 属性。理论上可以创建两个累积的 dist 属性开始；iedcum 用于常规有序分布，并说 d.ParetoCum 用于排序累积，但我在工具提示上使用 d.cum 并决定反对。

每个轴，我使用一个我认为更干净的单一序数比例，但需要一些工作来让标签对数字范围有意义，因为刻度线和标签不再像线性一样描绘垃圾箱规模。我的解决方案是仅使用数字范围作为刻度线，例如“1 - 1.99”，并添加一个函数来替代刻度线（不久前从d3.js 中的交替刻度填充中获得了该解决方案）。

对于条形排序，我使用这个 d3 示例作为参考，以防您需要在更简单/更小的示例的上下文中理解。

请参阅包含上述所有内容的小提琴。如果你想使用它，我建议添加一个检查以避免用户能够同时关闭条和线（在代码中留下一个注释......应该是微不足道的）

于 2016-02-17T09:28:43.330 回答
0

而不是对 y 进行排序。

data.sort(function(a,b){ return b.y - a.y;});

你应该对 x 进行排序

data.sort(function(a,b){ return a.x - b.x;});

工作代码在这里

于 2016-02-08T08:23:59.597 回答