将许多可能的输入值映射到离散色域 [英] Map many possible input values to discrete color domains

问题描述

我无法在d3的顺序量表上。我读的方式（和它的工作原理线性尺度，我觉得我应该可以这样进行：

I can't grok the docs on d3's ordinal scales. The way I read it (and the way it works for linear scales, I feel I should be able to proceed like this:

color = d3.scale.ordinal();
color.domain([0, 100]);      // Input is any percentage point 0-100
color.range([                // Output is a scale of colors from "bad" to "good"
  'red','orange','blue','green'
]);

这不会给我预期的结果：

This doesn't give me the results I expect:

color(0); // "red". Ok, that makes sense
color(1); // "blue". Huh? This should be "red"
color(100); // "orange". Really? I'm confused. What's the range?
color.range(); //["red", "orange", "blue", "green"]. That looks right...
color.domain(); // [0,1,100]. Um...

<

It looks like it's treating inputs as discrete categorical values when I want to treat them like numbers.

推荐答案

正确的方法可以用来处理输入数据。将数字范围映射到离散输出是使用 quantize 。这个区别对我来说不清楚，顺序看起来很直观。

The correct approach for mapping a range of numbers to discrete outputs is to use quantize. The difference wasn't clear to me and ordinal seemed intuitive. Figured it out now.

工作解决方案如下：

color = d3.scale.quantize();
color.domain([0, 100]);
color.range([
  'red','orange','blue','green'
]);

color(0);  // "red"
color(1);  // "red"
color(99); // "green"

这些链接有助于解决这个问题：

These links here helpful in figuring this out:

• http://roadtolarissa.com/blog/2015/01/04/coloring-maps-with-d3/

• http://roadtolarissa.com/blog/2015/01/04/coloring-maps-with-d3/
• What is the difference between d3.scale.quantize() and d3.scale.quantile()?

这篇关于将许多可能的输入值映射到离散色域的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！