javascript - Amcharts 在水平条形图中可视化部分数据

Question

我正在尝试可视化一个水平条形图，我想只显示一部分加载的记录并能够滚动结果。

我尝试使用垂直滚动条来执行此操作。这是生成的 JSFiddle: jsfiddle。

function loadBar(){ 

    // Themes begin
    am4core.useTheme(am4themes_animated);
    // Themes end

    // Create chart instance
    var chart = am4core.create("chartdiv", am4charts.XYChart);

    // Set up data source
    chart.data= [
    {"name": "Mario12","overhead": 2},
    {"name": "Jenny12","overhead": 2},
    ...
    ];


    //create category axis for years
    var categoryAxis = chart.yAxes.push(new am4charts.CategoryAxis());
    var yTitle = 'Agents';
    categoryAxis.title.text = yTitle;
    ...

    //create value axis for income and expenses
    var valueAxis = chart.xAxes.push(new am4charts.ValueAxis());
    valueAxis.min = 0;
    ...


    //create columns
    var series = chart.series.push(new am4charts.ColumnSeries());
    series.dataFields.categoryY = "name";
    series.dataFields.valueX = "overhead";
    ...

    chart.scrollbarY = new am4core.Scrollbar();
    chart.scrollbarY.parent = chart.leftAxesContainer;

}

loadBar();

想要的结果应该是结果