向折线图添加填充-任何图表中的数据以正确显示折线

Question

我正在使用ANYCHARTS中的折线图库来显示一些动态数据（从csv文件提取的数据）。当数据为100％时，我面临一些问题。该行显示不正确。我尝试在折线图配置中添加填充，但它在整个图表中添加了填充，而不仅仅是对数据线添加了填充。我希望有人能帮助我。enter image description here

如果有帮助，请参见以下代码；

anychart.onDocumentReady(function() {
var dataSet = anychart.data.set(AnyData);
var Q6_Trend_AnyChart = anychart.line();
Q6_Trend_AnyChart.animation(true);
Q6_Trend_AnyChart.padding([15, 20, 5, 20]);
Q6_Trend_AnyChart.title();
Q6_Trend_AnyChart.yScale().minimum(0);
Q6_Trend_AnyChart.yScale().maximum(100);
Q6_Trend_AnyChart.contextMenu().itemsFormatter(function(items) {
// Disable save as image option
// delete about and separator 
delete items["full-screen-separator"];
delete items["about"];
delete items["anychart-credits"];
delete items["share-with"];
delete items["select-marquee-start"];
// return modified array
return items;
});
var seriesData_1 = dataSet.mapAs({'x': 0, 'value': 1});
var series_1 = Q6_Trend_AnyChart.line(seriesData_1);
series_1.name('');
series_1.hovered().markers()
.enabled(true)
.type('circle')
.size(4);
series_1.tooltip()
.position('right')
.anchor('left-center')
.offsetX(5)
.offsetY(5);
series_1.stroke("3 white");
Q6_Trend_AnyChart.tooltip().format("\nPercent:{%Value}%");
Q6_Trend_AnyChart.background().fill("transparent");
var labelsx = Q6_Trend_AnyChart.yAxis().labels();
labelsx.fontSize(12);
labelsx.fontColor("#fff");
labelsx.useHtml(true);
labelsx.fontWeight(600);
var labels = Q6_Trend_AnyChart.xAxis().labels();
labels.enabled(false);
series_1.markers(true);
Q6_Trend_AnyChart.legend()
.enabled(false)
.fontSize(13)
.padding([0, 0, 10, 0]);
// set container id for the chart
Q6_Trend_AnyChart.container(id);
// initiate chart drawing
Q6_Trend_AnyChart.draw();
});
}

如果我在给定的代码中将顶部填充从15px增加到45px，则会得到此结果；但仍然该行显示不完美

enter image description here

Answer 1

最大比例表示数据图的顶部边缘。当自动计算yScale最大值时，图表会默认添加一个间隙。这样可以避免出现此问题。但是，如果手动应用yScale maximum，则会删除默认间隔。在这种情况下，要增加一些间隙，您应该增加刻度的最大值。另外，您也可以手动定义所需的刻度。有关详细信息，请检查the sample。