本文介绍了d3 v4平行坐标用d3 v4画笔选择路径的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在尝试实施类似于此的图表 -

I am trying to implement a chart similar to this -


所以我在这里找到了这个库 -

in d3 v4.So I found this library here -

最初是用d3 v4编写的,所以我找到了部分移植的d3 v4版本她 -

which was originally written in d3 v4 so I found a partial ported d3 v4 version her -

为此我将这个库与我的一些自定义设置一起使用后,我已经达到了这一点 -

for this so after using this library with some of my customizations I have reached this point here -

因此,如果打开块,您可以看到我无法再在y轴上绘制画笔。
我相信这是因为这个库中有一些d3.dispatch事件问题。

So, if you open the block you can see that I am not able to draw the brushes on the y-axis anymore.I believe this is because of some d3.dispatch event issue in this library.

这些是我必须在 mlarosa2 / parcoords 中进行的更改,以便生成至少一个正在运行的演示 -

These are the changes that I had to make to make in mlarosa2/parcoords in order to produce atleast a running demo -

d3.svg.brush() ----到---> d3.brush();

d3.svg.brush() ----to---> d3.brush();

brush.y(__.dimensions[axis].yscale)
.on("brushstart", function() {
if(d3.event.sourceEvent !== null) {
events.brushstart.call(pc, __.brushed);
d3.event.sourceEvent.stopPropagation();
}}).on("brush", function() {
brushUpdated(selected());}).on("brushend", function() {
events.brushend.call(pc, __.brushed);});

----to--->

brush.extent(__.dimensions[axis].yscale)
.on("start", function() {if(d3.event.sourceEvent !== null) {
// events.call('brushstart', pc, __.brushed);
events.brushstart.call(pc, __.brushed);
d3.event.sourceEvent.stopPropagation();
}})
.on("brush", function() {
brushUpdated(selected());
})
.on("end", function() {
// events.call('brushend', pc,__.brushed);
events.brushend.call(pc, __.brushed);
});

已更改 -

var brush = g.append("svg:g")
  .attr("class", "brush")
  .each(function(d) {
    d3.select(this).call(brushFor(d));
  });

----to--->

var brush = g.append("svg:g")
      .attr("class", "brush")
      .each(function(d) {
        try {d3.select(this).call(brushFor(d));} catch(e){}
      });

已更改 d3.svg.arc() d3.arc()

最后更改 -

d3.selectAll([canvas.foreground, canvas.brushed]).classed("faded", true);
data.forEach(path_highlight);
events.highlight.call(this, data);
----to--->
d3.selectAll([canvas.foreground.clientWidth, canvas.brushed.clientWidth]).classed("faded", true);
data.forEach(path_highlight);
events.call('highlight', this, data);

任何人都可以建议任何更改/有用的提示来查找/调试以下块中的问题,
这样我们就可以创造&将选择应用于y轴,如

- 更新 -

因此,在尝试了paracoords.js中的几个更改后,我们能够创建画笔手柄,但在移动时,画笔会刷新所有数据,而不是刷新选定的点。
我相信刷子设置有一些错误,这就是刷拉事件调用无法访问所选点的原因。

So, after trying a couple of more changes in the paracoords.js we were able to create the brush handles, but on movement the brushes refresh all data instead of just selected points from brush.I believe there is some error with the brush setting up which is why the selected points are not being accessible on the brushed event call.

任何人都可以看看这个问题&帮助看看是否可以解决这个问题。

Can any one please have a look into this issue & help to see if this can be fixed.

推荐答案

这不能直接解决您的问题,但最新版本的Parcoords(移植到d3 v5)是。我认为你不应该使用这个版本。截至2018年11月,这个回购正在积极发展。

This doesn't address your question directly but the latest version of Parcoords (ported to d3 v5) is https://github.com/BigFatDog/parcoords-es. I don't think you should have this issue using this version. As of November 2018, this repo is under active development.

这篇关于d3 v4平行坐标用d3 v4画笔选择路径的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-21 14:25