Angular-nvd3 折线图，线条呈现在图表外
Angular-nvd3 linechart with lines rendered outside chart
我正在使用 Krispos angular-nvd3 来呈现折线图。由于某种原因，线条呈现在图表之外或日期错误。 x 轴是时间刻度，xDomain 的最小值和最大值是使用日期选择器设置的。
设置 xDomain 时，图表将使用选定的开始日期和结束日期作为 x 轴的最小值和最大值来呈现。但是，由于数据集的最短日期早于选定的开始日期，因此线条在时间间隔之外呈现。在此示例中，选择的开始日期为 2015-08-08，结束日期为 2015-11-08:
如果我使用 forceX 而不是 xDomain 来设置最小值和最大值，则线条会在图表网格内呈现。但在这种情况下，数据集的最小日期早于选定的开始日期，因此 x 轴从 2015-07-07 而不是 2015-08- 开始08。如下图所示：
这些是使用的基本图表选项。 xDomain 或 forceX 是动态设置的。
$scope.chartOptions = {
图表： {
类型：'lineChart'，
y域：[0,5]，
xDomain: [时刻(data.startDate).valueOf(), 时刻(data.endDate).valueOf()],
使用InteractiveGuideline: true,
交互层：{
showGuideLine：真
},
行：{
},<br>
xScale: d3.time.scale(),
x轴：{
showMaxMin: 是的，
旋转标签：-45，
tickFormat：函数（d）{
return d3.time.format('%Y-%m-%d')(新日期(d));
}
},
身高：350，
利润 ： {
底部：100
}
}
};
我是否需要以某种方式使用范围才能正常工作，即仅在选定的开始和结束日期内呈现数据。
感谢您的意见！
此问题的解决方案是使用图表选项 clamp()，在这种情况下：
xScale: d3.time.scale().clamp(true)
日期比例设置使用 xDomain:
xDomain: [moment(data.startDate).valueOf(), moment(data.endDate).valueOf()]
我正在使用 Krispos angular-nvd3 来呈现折线图。由于某种原因，线条呈现在图表之外或日期错误。 x 轴是时间刻度，xDomain 的最小值和最大值是使用日期选择器设置的。
设置 xDomain 时，图表将使用选定的开始日期和结束日期作为 x 轴的最小值和最大值来呈现。但是，由于数据集的最短日期早于选定的开始日期，因此线条在时间间隔之外呈现。在此示例中，选择的开始日期为 2015-08-08，结束日期为 2015-11-08:
如果我使用 forceX 而不是 xDomain 来设置最小值和最大值，则线条会在图表网格内呈现。但在这种情况下，数据集的最小日期早于选定的开始日期，因此 x 轴从 2015-07-07 而不是 2015-08- 开始08。如下图所示：
这些是使用的基本图表选项。 xDomain 或 forceX 是动态设置的。
$scope.chartOptions = {
图表： {
类型：'lineChart'，
y域：[0,5]，
xDomain: [时刻(data.startDate).valueOf(), 时刻(data.endDate).valueOf()],
使用InteractiveGuideline: true,
交互层：{
showGuideLine：真
},
行：{
},<br>
xScale: d3.time.scale(),
x轴：{
showMaxMin: 是的，
旋转标签：-45，
tickFormat：函数（d）{
return d3.time.format('%Y-%m-%d')(新日期(d));
}
},
身高：350，
利润 ： {
底部：100
}
}
};
我是否需要以某种方式使用范围才能正常工作，即仅在选定的开始和结束日期内呈现数据。
感谢您的意见！
此问题的解决方案是使用图表选项 clamp()，在这种情况下：
xScale: d3.time.scale().clamp(true)
日期比例设置使用 xDomain:
xDomain: [moment(data.startDate).valueOf(), moment(data.endDate).valueOf()]