1

我正在使用 Kendo 条形图，它将显示动态数据的分组和堆叠。在类别字段中，我需要显示用户名，并且必须显示相应的指标值，这里的指标值是动态和可变的，指标计数值显示在条形中，就像堆积条形一样。

例如：度量值是 - High、Low、Medium、... 度量值计数 -> High-4、Low-2 和 medium -5 ,.. 这里计数 4,2 和 5 以堆叠形式显示酒吧。

像这样，我必须向具有各自值的多个用户显示。下面我展示了我的代码，我可以知道如何使用动态堆叠条形剑道图，并且我可以为上述问题提供解决方案。

代码图定义

$("#chartForWorkItems").kendoChart({

    title: {
        text: "Bugs State Analysis"
    },
    //defining the datasource for loading the chart
    dataSource: {
        transport: {
            read: {
                url: baseUri + "ProjectReportWorkItemChart/chartDisplayForWorkITems",
                cache: false,
                type: "POST",
                dataType: "json",
                complete: function (e) {




                },
            },
            parameterMap: function (options, operation) {
                console.log(selectedCategoryByMetrics);
                if (operation == "read") {
                    return {
                        workItems: selectedCategoryByMetrics,
                        Projectid: sessionStorage.getItem("prjprojectid"),
                        metricsWithWorkItem: metricsWithWorkItem,
                        users: usersSelected
                    }
                }
            },


        },
        schema: {
            model: {
                id: "field",
                fields: {
                    field: { type: "string" },
                    count_f: { type: "string" },
                    metric: { type: "string" },
                    assignedTo: { type: "string" },
                }
            }
        }
    },
    chartArea: {
        width: 400,
        height: 300,
    },
    seriesDefaults: {
        type: "column",

    },
    series: [{
        field: "count_f",

    },

    ],
    categoryAxis: {
           categories: "assignedTo",
        field: "field",
        majorGridLines: {
            visible: true
        }
    },

    valueAxis: [{                 //display count in the value axis
        line: {
            visible: true
        },
        majorGridLines: {
            visible: true
        }

    }],
    tooltip: {                      //To display tool tip
        visible: true
    },
});
4

0 回答 0