kendo UI条形图-系列数据如何显示百分比显示

时间:2019-01-08 04:52:52

标签: javascript kendo-ui kendo-chart

我正在使用kendo ui的条形图。 我正在尝试创建如下堆积的条形图: https://demos.telerik.com/kendo-ui/bar-charts/stacked100-bar

但是,我想在Kendo barchart中获得最大值(100%-stack:type =“ 100%”)的实际系列数据百分比之一。

这是我的示例代码:

function createExecutionToday(type) {
		var running =/*[[#{dashboard.Executing}]]*/;			
		var success =/*[[#{dashboard.Success}]]*/;			
		var check =/*[[#{dashboard.Check}]]*/;		
		
        	 $("#"+type).kendoChart({
                 dataSource: {
                     transport: {
                         read: {
                             url: "dashboard/" + type +".json",
                             dataType: "json"
                         }
                     },
                     schema:{
                     	data: function(response){
                     		for(i in response)
                     		{
                     			var status = response[i].status;
                     			response[i].status = toKorean(status);
                     		
                     		}
                     		return response;
                     	}
                     },
                     
                 },
                 legend: {
                     visible: false
                   },
                   chartArea: {
               	    background: "#F8F8F8"
                 },
                   seriesDefaults: {
                	 type: "bar",
                     labels: {
                       visible: true,
                       background: "transparent",
                     },
                     
	                 overlay: null
                   },
                   series: [{
                 
                      field:"count",
                      statck:{type:"100%"},
                      color : function(status){
                        var colors = ["#66CCFF", "#DB7196", "#E5B055"];
                        return colors[status.index];
                      }
                   }],
                  
                   categoryAxis: {
                       categories: [running, success, check],
                       majorGridLines: {
                           visible: false
                       },
                       line:{
                    	   visible: false
                       },
                       labels: {
                    	   font : "15px arial"
                       }
                   },
                   valueAxis: {
                       labels: {
                         format: "{0}%"
                       },
                       line: {
                         visible: false
                       },
                       labels: {
                         visible: false
                       },
                       majorGridLines: {
                           visible: false
                       },
                     },
                   tooltip: {
                       visible: true,
                       
                       template: "#= series.field #: #= value #"
                   },
                  
                  }
                 
             });
   }

系列类型:100%是否可以通过选项实现? 你有什么主意吗?

enter image description here

0 个答案:

没有答案