Полоса прокрутки в amcharts4 для серии строк не работает должным образом.В настоящее время я создал динамический ряд линий, в котором он может создавать график в соответствии с различным состоянием, которое я имею в данных.Все работает нормально, но когда я использую полосу прокрутки для проверки определенного интервала дней или месяцев, график исчезает, что раньше показывалось, когда он находился в обычном режиме уменьшения масштаба.График не работает должным образом, когда я пытался изменить дату с помощью опции прокрутки для масштабирования в месяцы или дни.
Я просмотрел документацию и проверил свой код, но не вижу в этом никаких проблем.Вероятно, это проблема, возникающая, когда я динамически изменяю дату с помощью опции прокрутки, тогда данные не кодируются в графике должным образом
am4core.ready(function() {
function am4themes_myTheme(target) {
if (target instanceof am4core.ColorSet) {
target.list = [
am4core.color("red"),
am4core.color("blue"),
am4core.color("green"),
am4core.color("orange"),
am4core.color("#6FF861"),
am4core.color("#E78426"),
am4core.color("#33FFE0"),
];
}
}
// Themes begin
am4core.useTheme(am4themes_myTheme);
// Themes end
// Create chart instance
var chart = am4core.create("newtrendgraph", am4charts.XYChart);
// Add data
// Set input format for the dates
chart.dateFormatter.inputDateFormat = "yyyy-MM-dd";
// Create axes
var dateAxis = chart.xAxes.push(new am4charts.DateAxis());
var valueAxis = chart.yAxes.push(new am4charts.ValueAxis());
var a;
var allData = [];
for (var j = 0; j < names.length; j++) {
var date=[];
var values=[];
var objarray = jQuery.parseJSON(datadef[j]);
$.each(objarray, function(key,value) {
date.push(value.x);
values.push(value.y);
});
a ="value"+j;
for(var i=0; i<date.length;i++){
var temp = {
"date": date[i]
};
temp[a] = values[i];
allData.push(temp);
}
}
chart.data = allData;
chart.legend = new am4charts.Legend();
chart.legend.position = "top";
for (var int = 0; int < names.length; int++) {
// Create series
var res = names[int];
var series =new am4charts.LineSeries();
series.dataFields.valueY = "value"+int;
series.dataFields.dateX = "date";
//series.stroke = am4core.color("#ff0000"); // red
//series.tooltipText = "{valueY}";
series.strokeWidth = 2;
series.minBulletDistance = 15;
series.name = names[int];
//series.legendSettings.valueText = "{res}";
series.tensionX = 1;
series.fillOpacity = 0.2;
series.stacked = true;
// Drop-shaped tooltips
series.tooltip.background.cornerRadius = 20;
series.tooltip.background.strokeOpacity = 0;
series.tooltip.pointerOrientation = "vertical";
series.tooltip.label.minWidth = 40;
series.tooltip.label.minHeight = 40;
series.tooltip.label.textAlign = "middle";
series.tooltip.label.textValign = "middle";
// Make bullets grow on hover
var bullet = series.bullets.push(new am4charts.CircleBullet());
bullet.circle.strokeWidth = 3;
bullet.circle.radius = 4;
bullet.circle.fill = am4core.color("#fff");
var bullethover = bullet.states.create("hover");
bullethover.properties.scale = 1.7;
// Make a panning cursor
chart.cursor = new am4charts.XYCursor();
chart.cursor.behavior = "panXY";
chart.cursor.xAxis = dateAxis;
// chart.cursor.yAxis = valueAxis;
//chart.cursor.snapToSeries = series;
// Create vertical scrollbar and place it before the value axis
chart.scrollbarY = new am4core.Scrollbar();
// chart.scrollbarY.parent = chart.leftAxesContainer;
// chart.scrollbarY.toBack();
// Create a horizontal scrollbar with previe and place it underneath the date axis
chart.scrollbarX = new am4charts.XYChartScrollbar();
// chart.scrollbarX.series.push(series);
chart.scrollbarX.parent = chart.bottomAxesContainer;
// chart.legend = new am4charts.Legend();
chart.events.on("ready", function () {
dateAxis.zoom({start:0.79, end:1});
});
chart.series.push(series);
}
});
Это должно создать график даже при увеличении масштаба с помощью опции прокрутки, если график виден в уменьшенном масштабережим.