Javascript 如何规范化d3中的数据并在轴上绘制独立于其他线范围的线

我有一个在d3.js中可视化的平行坐标图，我的问题在于数据，“汽车”、“自行车”、“船”和“飞机”的不同线条具有不同的数字范围，因此数字较低的线条无法看到，而是表示为一条平线。例如，由于飞机数据要大得多，因此这条曲线与“汽车”线一致

我似乎不知道如何规范化数据，以便当“类型”为“汽车”时，从0规范化为1，当类型为“自行车”或“船”时，从0规范化为最大值。但在轴上显示这些数据，而不依赖于其他数据。如您所见，轴没有范围标签。相反，我计划在将鼠标悬停在一条线上时显示确切的数据

这是d3代码：

var数据集=[{
“类型”：“汽车”，
“第一”：0.65，
“第二”：0.34，
“第三”：0.55，
“第四”：0.39
},
{
“类型”：“汽车”，
“数据集”：“列车”，
“第一”：0.59，
“第二”：0.33，
“第三”：0.50，
“第四”：0.40
},
{
“类型”：“自行车”，
“第一”：200，
“第二”：230，
“第三”：250，
“第四”：300
},
{
“类型”：“自行车”，
“数据集”：“列车”，
“第一”：200，
“第二”：280，
“第三”：225，
“第四”：278
},
{
“类型”：“船”，
“第一”：320，
“第二”：324，
“第三”：532，
“第四”：321
},
{
“类型”：“船”，
“数据集”：“列车”，
“第一”：128，
“第二”：179，
“第三”：166，
“第四”：234
},
{
“类型”：“飞机”，
“第一”：1500，
“第二”：2000年，
“第三”：2321，
“第四”：1793年
},
{
“类型”：“飞机”，
“数据集”：“列车”，
“第一”：1438，
“第二”：2933，
“第三”：2203，
“第四”：2000年
}
]
var保证金={
前五名，
右:50,，
底部：5，
左：70
},
宽度=600-边距。左侧-边距。右侧，
高度=280-margin.top-margin.bottom；
变量维度=[{
名称：“类型”，
比例：d3.scale.ordinal（）.rangePoints（[0，高度]），
类型：“字符串”
},
{
名称：“第一”，
比例：d3.比例.线性（）.范围（[高度，0]），
类型：“编号”
},
{
姓名：“第二”，
比例：d3.比例.线性（）.范围（[高度，0]），
类型：“编号”
},
{
名称：“第三”，
比例：d3.比例.线性（）.范围（[高度，0]），
类型：“编号”
},
{
名称：“第四”，
比例：d3.比例.线性（）.范围（[高度，0]），
类型：“编号”
}
];
var maxRange=d3.max（数据集，函数（d）{
返回Math.max（d.first、d.second、d.third、d.fourth）；
});
var x=d3.scale.ordinal（）
.domain（维度）映射（函数（d）{
返回d.name；
}))
.范围点（[0，宽度]）；
var line=d3.svg.line（）
.已定义（功能（d）{
return！isNaN（d[1]）；
});
//创建颜色比例
var color=d3.scale.ordinal（）
.范围（[“#4683b8”、“#79add2”、“#a6c9de”、“#cadbed”、“#9d9bc4”、“#bcbed9”、“#DADADEA”、“#f6d2a8”、“#f2b076”、“#ef914e”、“#d65e2a”））
var yAxis=d3.svg.axis（）
.东方（“左”）；
var svg=d3。选择（“并行”）
.append（“svg”）
.attr（“宽度”，宽度+边距。左侧+边距。右侧）
.attr（“高度”，高度+边距。顶部+边距。底部）
.附加（“g”）
.attr（“转换”，
“翻译（“+margin.left+”，“+margin.top+”）；
var-dimension=svg.selectAll（“.dimension”）
.数据（尺寸）
.enter（）.append（“g”）
.attr（“类别”、“维度”）
.attr（“转换”，函数（d）{
返回“translate（“+x（d.name）+”）；
});
函数并行（数据集）{
尺寸。forEach（功能（尺寸）{
dimension.scale.domain（dimension.type==“number”？
（[0，maxRange]）：
dataSet.map（函数（d）{
返回d[dimension.name]；
}));
});
svg.append（“g”）
.attr（“类”、“背景合作路径”）
.selectAll（“路径”）
.数据（数据集）
.enter（）.append（“路径”）
.attr（“d”，draw）；
//使用颜色比例根据数据设置笔划
前台=svg.append（“g”）
.attr（“类”、“前景合作路径”）
.selectAll（“路径”）
.数据（数据集）
.输入（）
.append（“路径”）
.attr（“d”，绘图）
.样式（“笔划”，功能（d）{
var company=d.type.slice（0，d.type.indexOf（“”））；
返回颜色（公司）；
})
维度。追加（“g”）
.attr（“类”、“轴”）
.每个功能（d）{
d3.选择（this）.call（yAxis.scale（d.scale））；
})
//删除轴编号
svg.selectAll（“.tick”）
.每个功能（d）{
如果（类型d=='number'）{
这个。删除（）；
}
});
var ordinal_labels=svg.selectAll（“.axis text”）
.on（“鼠标悬停”，鼠标悬停）
.on（“mouseout”，mouseout）；
var projection=svg.selectAll（“.background path，.foreground path”）
.on（“鼠标悬停”，鼠标悬停）
.on（“mouseout”，mouseout）；
//d3.选择全部（“[dataset=train]”）。属性（“可见性”、“隐藏”）；
让trainline=d3。选择全部（“.coorPath path”）。过滤器（函数（d）{
返回d.dataset==“列车”；
})
.attr（“可见性”、“隐藏”）；
//单击后，我们希望向数组和图表添加数据
让lines=svg.selectAll（.coorPath path”）。打开（“鼠标悬停”，函数（d）{
//单击“其他”时显示列车
trainline.attr（“可见性”、“可见”）
trainline.style（“笔划数组”（“5,5”））
线条.样式（'opacity'，函数（e）{
返回e.type==d.type？1:0.2；
});
});
//单击后，我们希望向数组和图表添加数据
行。on（“鼠标出”，功能（d）{
//单击“其他”时显示列车
lines.style（'opacity'，null）；
trainline.attr（“可见性”、“隐藏”）
});
//使平行坐标打印交互以高亮显示线
功能鼠标盖（d）{
svg.classed（“活动”，true）；
如果（类型d==“字符串”）{
投影。分类（“非活动”，功能（p）{
返回p.name！==d；
});
投影.过滤器（函数（p）{
返回p.name==d；
}).每个（向前移动）；
有序标签。分类（“非活动”，功能（p）{
返回p！==d；
});
序号标签。