Динамическая кластерная диаграмма с направляющими

Question

Мне нужно построить кластерную гистограмму, которая имеет динамически генерируемые графики и динамически кластеризована. Я успешно сгенерировал диаграмму, за исключением отображения направляющих для кластеров. Я создал массив направляющих, но направляющие не отображаются. Кто-нибудь может увидеть, что я пропускаю или делаю неправильно?

Я руководствуюсь работой над этим AmCharts: Кластерная гистограмма с подкатегориями

chartData = [{"Poor":"0.0","Attribute":"capacity","Fair":"0.0","No Rate":"0.0","Title":"adnan test large upload","Good":"0.0"}, {"Poor":"0.0","Attribute":"capacity","Fair":"0.0","No Rate":"0.0","Title":"adnan test large upload","Good":"0.0"}, {"Poor":"0.0","Attribute":"condition","Fair":"0.0","No Rate":"0.0","Title":"adnan test large upload","Good":"0.0"}, {"Poor":"0.0","Attribute":"condition","Fair":"0.0","No Rate":"0.0","Title":"adnan test large upload","Good":"0.0"}, {"Poor":"0.0","Attribute":"function","Fair":"0.0","No Rate":"0.0","Title":"adnan test large upload","Good":"0.0"}, {"Poor":"0.0","Attribute":"function","Fair":"0.0","No Rate":"0.0","Title":"adnan test large upload","Good":"0.0"}, {"Poor":"28.0","Attribute":"capacity","Fair":"40.0","No Rate":"0.0","Title":"Another test","Good":"80.0"}, {"Poor":"28.0","Attribute":"capacity","Fair":"40.0","No Rate":"0.0","Title":"Another test","Good":"80.0"}, {"Poor":"28.0","Attribute":"condition","Fair":"40.0","No Rate":"0.0","Title":"Another test","Good":"80.0"}, {"Poor":"28.0","Attribute":"condition","Fair":"40.0","No Rate":"0.0","Title":"Another test","Good":"80.0"}, {"Poor":"28.0","Attribute":"function","Fair":"40.0","No Rate":"0.0","Title":"Another test","Good":"80.0"}, {"Poor":"28.0","Attribute":"function","Fair":"40.0","No Rate":"0.0","Title":"Another test","Good":"80.0"},....]

Я сократил данные, думаю, вы увидите их природу.

Вот код, обратите внимание, что я использую объектную модель amChart.

function drawChartSAMPfig3(chartData, target){
if(chartData.length !== 0){
    var graphs =  []
    var i = 0
    var colours = ['#b01f39','#66cc33','#fbb03b','#fffff','#000000']
    var Titles = []
    for (c = 0; c < chartData.length; c ++){
        Titles[c] = chartData[c]["Title"];
    }

Titles = Array.from(new Set(Titles))
    var Keys = Object.keys(chartData[0])
    var Attribute = Keys.filter(item => item !== "Title")
    Attribute = Attribute.filter(item => item !== "Attribute")
    var guides = []

Titles.forEach(function(Titles){
    guides.push({"category": Titles[0],
                  "toCategory": Titles[Titles.length - 1],
                  "lineAlpha": 0,
                  "expand": true,
                  "label": Titles,
                  "labelRotation": 0,
                  "tickLength": 80
              })
        })

Attribute.forEach(function(Attribute){
    i++
    graphs.push({
            "valueField": Attribute,
            "title": Attribute,
            "type": 'column',
            "labelText": '[[value]]%',
            "fillColors": colours[i],
            "lineColor": colours[i],
            "labelOffset": 10,
            "fillAlphas": 1,
            "balloonText": "<b>[[title]]</b><br><span style='font-size:14px'>[[category]]: <b>[[value]]</b></span>",
            "stackable": false
      })
    })

$(function(){
    var oChart                      = new AmCharts.AmSerialChart();
        oChart.pathToImages             = "thirdparty/amcharts/images/";
        oChart.dataProvider             = chartData;
        oChart.categoryField            = "Attribute";
        oChart.angle                    = 0;
        oChart.depth3D                  = 0;
        oChart.rotate                   = false;
        oChart.gridAboveGraphs          = true;
        oChart.startDuration            = 0;
        oChart.backgroundAlpha          = 0.8;
        oChart.type                     = "serial";
        oChart.fontFamily               =  "Roboto-Light, Muli, Arial, Verdana, SansSerif";
        oChart.categoryAxis             = { "gridAlpha": 0,
                                            "labelRotation": 90,
                                            "guides" : guides,
                                            "position": "left"
                                            };
        oChart.columnWidth              = 0.55;
        oChart.graphs = graphs
        oChart.valueAxes = [
            {
                "id": "ValueAxis-1",
                "stackType": "regular",
                "axisAlpha": 0,
                "minimum": 1,
                "position": "left",
            }
        ],
        oChart.legend  = [{
            "enabled": true,
            "useGraphSettings": true,
            //"maxColumns": 8,
            "size": 8
        }],
        oChart.titles = [{
            "id": "Figure 3",
            "size": 18,
            "text": "Figure 3"
            }]

        oChart.write(target);
            });
        } 
    }

Вот что я получаю (показывая диаграмму для полного набора данных).