6

有人可以提供一些关于规模和范围如何在 cubism.js 中协同工作的见解吗

  .call(context.horizon()
             .extent([-100, 100])
             .scale(d3.scale.linear().domain([-10,10]).range([-100,100])
                   )
     );

例如上面的代码是做什么的?如果这些值是使用随机数生成器生成的(-10 到 10 之间的数字)

我知道范围用于设置最大值和最小值。

我知道如何定义比例,例如:

var scale = d3.scale.threshold().domain([100]).range([0,100])
console.log(scale(1)) // returns 0
console.log(scale(99.9)) // returns 0
console.log(scale(88.9)) // returns 0
console.log(scale(100)) // returns 100

我在这里阅读了 d3.scales http://alignedleft.com/tutorials/d3/scales/

我的主要问题是我想为我的数据定义阈值,非常简单 0-98 Red 98-100 Pink 100 Blue

或者也许只是 0-99.99 红 100 蓝

但是我无法使用我读过的所有内容来构建有效的东西。

4

1 回答 1

1

我猜您只是想使用不同的颜色来表示数据中的异常。如果这是真的,您不需要创建域和范围。

您可以像这样创建自定义调色板:

var custom_colors = ['#ef3b2c', '#084594', '#2171b5', '#4292c6', '#6baed6', '#9ecae1', '#c6dbef', '#deebf7', '#f7fbff', '#f7fcf5', '#e5f5e0', '#c7e9c0', '#a1d99b', '#74c476', '#41ab5d', '#238b45', '#006d2c', '#00441b'];

此调色板是使用此页面上的调色板构建的,并在末尾添加了额外的红色。

然后只需像这样调用自定义颜色:

d3.select("#testdiv")
  .selectAll(".horizon")
  ...
  .call(context.horizon()
               .colors(custom_colors)
  ));

玩弄颜色,直到找到你喜欢的组合。在上面的这个例子中,只有异常值是红色的,而其余的将遵循蓝色和绿色的模式。

希望这可以帮助!

于 2013-08-02T15:46:59.670 回答