6

我真的很喜欢这张图表及其功能，它非常适合我想要/需要的东西。我唯一需要改变的是我需要它来允许 y 轴上的序数数据，我似乎无法让它工作（我是初学者）。

当我将 y 比例从线性更改为序数时：

yscale[k] = d3.scale.linear() .domain(d3.extent(data, function(d) { return +d[k]; })) .range([h, 0]));

至

yscale[k] = d3.scale.ordinal().rangePoints([h, 0]),
      yscale[k].domain(data.map(function(d) { return d[k]; })))

刷牙仍然会显示并自行工作，但它不会过滤留下选定的线条。除非我将它移到轴的最顶部，否则不会出现任何线条，然后全部或大部分都显示出来。当我用萤火虫单步执行代码时，它看起来只是没有得到画笔区域中的线条，而是全部（？）......我似乎无法弄清楚。:(

如果有人可以帮助解决这个问题（尤其是我必须改变的所有地方以及如何改变），我很乐意让它工作并了解我做错了什么:-\

4

2 回答 2

5

刷一个序数轴返回像素，刷一个定量轴返回域。

https://github.com/mbostock/d3/wiki/SVG-Controls#wiki-brush_x

尺度通常定义为定量尺度，在这种情况下，范围位于尺度域的数据空间中；但是，它可以改为定义为序数比例，其中范围在比例范围范围内的像素空间中。

我的猜测是您需要向后工作并将像素转换为域值。我发现了这个问题，因为我正在尝试做同样的事情。如果我弄明白了，我会告诉你的。

编辑：这是一个很棒的示例，可以帮助您入门。

http://philau.willbowman.com/2012/digitalInnovation/DevelopmentReferences/LIBS/d3JS/examples/brush/brush-ordinal.html

function brushmove() {
  var s = d3.event.target.extent();
  symbol.classed("selected", function(d) { return s[0] <= (d = x(d)) && d <= s[1]; });
}

他抓取选择范围（以像素为单位），然后选择所有系列元素并确定它们是否位于范围内。您可以基于此过滤元素，并返回数据键或您要添加到过滤器中的内容。

于 2012-11-09T21:22:20.467 回答
1

这里有一个带有刷牙的序数比例示例：

http://bl.ocks.org/chrisbrich/4173587

正如@gumballhead 所建议的那样，基本思想是，您负责将像素值投影回输入域。示例中的相关片段是：

brushed = function(){var selected =  yScale.domain().filter(function(d){return (brush.extent()[0] <= yScale(d)) && (yScale(d) <= brush.extent()[1])});                     
                             d3.select(".selected").text(selected.join(","));}
于 2015-01-22T19:04:56.760 回答