Javascript D3当Y轴有最小值和最大值时，隐藏图表区溢出

我想创建一个图表，当我有Y轴的最大值和最小值时，它将隐藏折线图的溢出。例如，我有一个最小值200。我从

Y.domain（[0，d3.max（数据集，函数（d）{returnd.value；}）]）修改了Y轴的域

to

y.domain（[200，d3.max（数据集，函数（d）{返回d.value；}）]。但是，如果它在SVG元素中X轴下方有足够的空间，它将从X轴下方开始。我在其他一些帖子中看到应该使用forceY（）函数，但据我所知，它只适用于NVD3。。。此外，处理数据和删除低于指定级别的数据点也不是解决方案


var数据集=[{date:'2013-01'，value:'53'}，{date:'2013-02'，value:'165'}，{date:'2013-03'，value:'269'}，
{date:'2013-04'，value:'344'}，{date:'2013-05'，value:'376'}，{date:'2013-06'，value:'410'}，
{date:'2013-07'，value:'421'}，{date:'2013-08'，value:'405'}，{date:'2013-09'，value:'376'}，
{date:'2013-10'，value:'359'}，{date:'2013-11'，value:'392'}，{date:'2013-12'，value:'433'}，
{date:'2014-01'，value:'455'}，{date:'2014-02'，value:'478'}，{date:'2014-03'，value:'455'}，
{日期：'2014-04'，值：'500'}]；
//设置画布/图形的尺寸
var margin={顶部：30，右侧：20，底部：40，左侧：50}，
宽度=600-边距。左侧-边距。右侧，
高度=370-margin.top-margin.bottom；
//解析日期/时间
var parseDate=d3.time.format（“%Y-%m”）.parse；
//设定范围
var x=d3.time.scale（）.range（[0，width]）；
变量y=d3.scale.linear（）.range（[height，0]）；
//定义轴
var xAxis=d3.svg.axis（）.scale（x）
.orient（“底部”）.tickFormat（d3.time.format（“%m”））；
var yAxis=d3.svg.axis（）.scale（y）
.方向（“左”）。勾号（5）；
//界定界线
var valueline=d3.svg.line（）
.interpolate（“basis”）//使直线平滑
.x（函数（d）{返回x（d.date）；}）
.y（函数（d）{返回y（d.value）；}）；
//添加svg画布
var svg=d3.选择（“主体”）
.append（“svg”）
.attr（“宽度”，宽度+边距。左侧+边距。右侧）
.attr（“高度”，高度+边距。顶部+边距。底部）
.attr（“id”、“svg01”）
.附加（“g”）
.attr（“转换”，
“翻译（“+margin.left+”，“+margin.top+”）；
//获取数据
dataSet.forEach（函数（d）{
d、 日期=解析日期（d.date）；
d、 值=+d.值；
});
//缩放数据的范围
x、 域（d3.extent（数据集，函数（d）{returnd.date；}））；
y、 域（[200，d3.max（数据集，函数（d）{返回d.value；}）]；
//添加valueline路径。
追加（“路径”）
.attr（“类”、“行”）
.attr（“d”，valueline（数据集））；
//添加X轴
svg.append（“g”）
.attr（“类”、“x轴”）
.attr（“变换”、“平移（0）”、“高度+”）
.呼叫（xAxis）；
//添加Y轴
svg.append（“g”）
.attr（“类”、“y轴”）
.呼叫（yAxis）
正文{
字体：12px Arial；
}
路径{
笔画：钢蓝；
笔画宽度：2；
填充：无；
}
.轴线路径，
.轴线{
填充：无；
笔画：灰色；
笔画宽度：1；
形状渲染：边缘清晰；
}
您需要应用clipPath：


var数据集=[{date:'2013-01'，value:'53'}，{date:'2013-02'，value:'165'}，{date:'2013-03'，value:'269'}，
{date:'2013-04'，value:'344'}，{date:'2013-05'，value:'376'}，{date:'2013-06'，value:'410'}，
{date:'2013-07'，value:'421'}，{date:'2013-08'，value:'405'}，{date:'2013-09'，value:'376'}，
{date:'2013-10'，value:'359'}，{date:'2013-11'，value:'392'}，{date:'2013-12'，value:'433'}，
{date:'2014-01'，value:'455'}，{date:'2014-02'，value:'478'}，{date:'2014-03'，value:'455'}，
{日期：'2014-04'，值：'500'}]；
//设置画布/图形的尺寸
var margin={顶部：30，右侧：20，底部：40，左侧：50}，
宽度=600-边距。左侧-边距。右侧，
高度=370-margin.top-margin.bottom；
//解析日期/时间
var parseDate=d3.time.format（“%Y-%m”）.parse；
//设定范围
var x=d3.time.scale（）.range（[0，width]）；
变量y=d3.scale.linear（）.range（[height，0]）；
//定义轴
var xAxis=d3.svg.axis（）.scale（x）
.orient（“底部”）.tickFormat（d3.time.format（“%m”））；
var yAxis=d3.svg.axis（）.scale（y）
.方向（“左”）。勾号（5）；
//界定界线
var valueline=d3.svg.line（）
.interpolate（“basis”）//使直线平滑
.x（函数（d）{返回x（d.date）；}）
.y（函数（d）{返回y（d.value）；}）；
//添加svg画布
var svg=d3.选择（“主体”）
.append（“svg”）
.attr（“宽度”，宽度+边距。左侧+边距。右侧）
.attr（“高度”，高度+边距。顶部+边距。底部）
.attr（“id”、“svg01”）
.附加（“g”）
.attr（“转换”，
“翻译（“+margin.left+”，“+margin.top+”）；
//加上这个////////////////////////
svg.append（“defs”）.append（“clipPath”）
.attr（“id”、“剪辑”）
.append（“rect”）
.attr（“宽度”，宽度）
.attr（“高度”，高度）；
/////////////////////////////////////
//获取数据
dataSet.forEach（函数（d）{
d、 日期=解析日期（d.date）；
d、 值=+d.值；
});
//缩放数据的范围
x、 域（d3.extent（数据集，函数（d）{returnd.date；}））；
y、 域（[200，d3.max（数据集，函数（d）{返回d.value；}）]；
//添加valueline路径。
追加（“路径”）
//还有这个////////////////////////////////
.attr（“剪辑路径”、“url（#剪辑）”）
///////////////////////////////////////////
.attr（“类”、“行”）
.attr（“d”，valueline（数据集））；
//添加X轴
svg.append（“g”）
.attr（“类”、“x轴”）
.attr（“变换”、“平移（0）”、“高度+”）
.呼叫（xAxis）；
//添加Y轴
svg.append（“g”）
在