我（仍在）使用来自 github（https://github.com/syntagmatic/parallel-coordinates#parallel-coordinates）的并行坐标库（基于 d3.js）处理一些数据的表示。
目前我面临的问题是，在我重新排列轴之后，有一个不应该存在的阴影。
将数据上传到网站后，情节如下所示：
重新排序后（将第一个切换到轴），情节如下所示：
在这里，您可以看到第二轴和第三轴之间的阴影，它不应该存在。
其他阴影工作正常（如下图所示）。只有这个额外的。
如果我可能以错误的方式使用 .shadows() 方法，我检查了库的 api 描述，但没有找到任何东西。我虽然检查了问题、stackoverflow 和谷歌，但没有发现任何有用的东西。
这是我的代码：
<link rel="stylesheet" type="text/css" href="Imports/d3.parcoords.css">
<link rel="stylesheet" type="text/css" href="Imports/style.css">
<script src="Imports/lib/d3.min.js"></script>
<script src="Imports/d3.parcoords.js"></script>
<link rel="stylesheet" type="text/css" href="Imports/d3.parcoords.css">
<link rel="stylesheet" type="text/css" href="Imports/style.css">
<body>
<input type="file" id="fileInput" />
<div id="example" class="parcoords" style="width:700px; height:300px; position:relativ;"></div>
<script>
function handleFileSelect(evt) {
var inputFiles=evt.target.files;
var reader=new FileReader();
reader.onload = (function(e){
ausfuehren(reader.result); //call the 'main' method
});
reader.readAsText(inputFiles[0]);
}
document.getElementById('fileInput').addEventListener('change', handleFileSelect, false);
// main method
function ausfuehren(eingabe){
var save=eingabe;
save=parse(save);
save=drawParallelCoordinates(save);
}
// text ->objekt Array
function parse(text){
var ergebnis= text.split("\n"); //split into single lines
var header = ergebnis[0].split(","); //split the first line by "," to get the names of the attributes/dimensions
var final_res = []; //arrayList
for (var i = 1; i<ergebnis.length; i++) { //loop over the following lines, which contain the information for the representet objekts
var zeile=ergebnis[i];
var tmp = zeile.split(","); //split by "," to get the single attributevalues
final_res.push({}); //push a new objekt to the array list
for (var j = 0, element; element = tmp[j]; j++) { //loop over every attribute
final_res[i-1][header[j]] = element; // add dynamical one attribute to the objekt with the identifier which is in the header and the value from the csv
}
}
return final_res;
}
// eingabe: the data
function drawParallelCoordinates(eingabe){ //Objekt Array -> Parcoords Objekt
console.log("drawParallelCoordinates: The data:",eingabe);
var parcoords = d3.parcoords()("#example")
.data(eingabe)
.render()
.reorderable()
.shadows()
.brushMode("1D-axes")
return parcoords;
}
</script>
</body>
（如果你想运行它（它应该可以工作），你需要在导入目录中导入 d3 和 paarcoords lib，该目录必须与 htmlfile 位于同一目录中）（你可以在以下链接： http ://ge.tt/31WHTgL2/v/0?c ）
主要功能部分是代码末尾的drawParallelCoordinates方法。
上传的 csv 文件包含以下内容：
name,reifen,tueren,ps
audi ,4,5,300
motorad,2,0,100
fiat,4,5,60
trike,3,0,130
内部数据（直接在移交给 parcoords 之前）如下：
问题是：我做错了吗？如果是这样：我做错了什么，正确的解决方案是什么，或者我在哪里可以找到答案？
还是我在图书馆面临一个错误
更新：（一些附加信息）
看起来相似的一件事（它也会导致错误的阴影）可能是由缺少/未定义的值引起的。但在这里我认为情况并非如此，因为我没有找到一个点，在我的小（上面的 postet）示例中可能缺少一个值。
我观察到所描述的行为只出现在图的底部（这意味着：只有当彼此相邻的轴的最小值被连接时）如果您随后更改轴的顺序，阴影就会保留。所以你可以创造新的错误阴影。（目前我不知道是否会从一开始就有这样的错误阴影）
小提琴
这是工作小提琴：https
:
//jsfiddle.net/x74wemq0/4/ 不知何故，错误不会出现在小提琴的结果窗口中。也许我只使用了旧版本的库，并且该错误已经修复。（我会检查这个）
提前感谢
琼斯