Por alguna razón, value_2 cubre value_1 a las 2:00 si oculta la leyenda value_2, puede ver la columna value_1.
¿Cómo los apilo automáticamente y muestro información sobre herramientas para ambos? Si cambio el orden de los datos, la información sobre herramientas se muestra para ambos valores a las 2:00 pero value_2 todavía cubre value_1.
Por favor ayuda
am4core.ready(function() { var chart = am4core.create("chartdiv", am4charts.XYChart); chart.scrollbarX = new am4charts.XYChartScrollbar(); chart.cursor = new am4charts.XYCursor(); chart.cursor.xAxis = dateAxis; chart.legend = new am4charts.Legend(); function createSeries(field, color) { var series = chart.series.push(new am4charts.ColumnSeries()); series.dataFields.valueY = field; series.dataFields.dateX = "date"; series.strokeWidth = 0; series.fill = am4core.color(color); series.clustered = false; series.minBulletDistance = -1; series.name = field; series.columns.template.tooltipText = "{name}: [bold]{valueY}[/]"; series.stacked = true; chart.scrollbarX.series.push(series); return series; } // Create axes var valueAxis = chart.yAxes.push(new am4charts.ValueAxis()); valueAxis.min = 0; var dateAxis = chart.xAxes.push(new am4charts.DateAxis()); dateAxis.renderer.minGridDistance = 50; dateAxis.baseInterval = { "timeUnit": 'hour', "count": 1 }; createSeries('value_1', '#646464'); createSeries('value_2', '#333333'); chart.data = [ { "date": new Date(2021, 5, 4, 1), "value_1": 2 }, { "date": new Date(2021, 5, 4, 2), "value_1": 2, }, { "date": new Date(2021, 5, 4, 2), "value_2": 9, }, ]; }); // end am4core.ready()Sus datos deben agruparse por fecha; separarlos como elementos individuales causará fallas visuales como en su codepen.
chart.data = [ { date: new Date(2021, 5, 4, 1), value_1: 2 }, { date: new Date(2021, 5, 4, 2), value_1: 2, value_2: 9 } ];