2016-07-19 69 views
0

我有一個圖表,如何在劍道圖mvc中分類系列?

目的圖表會說男性總&女的,基於國家&國籍明智。成功生成圖表

這是我創建的小提琴。

jsFiddle example對於參考

如何類別系列標籤。

我試圖定位類似這樣的系列名稱..建議我怎樣才能

enter image description here

樣品剃刀代碼試圖

@(Html.Kendo().Chart() 
    .Name("chart") 
    .Title("Gender Summay based on the total") 
    .Legend(legend => legend 
     .Position(ChartLegendPosition.Bottom) 
    ) 
    .Series(series => 
    { 
     series.Column(new double[] { 54, 5 }).Name("2010 Bah") 
     .Labels(labels => 
     labels.Template("#= series.name #")   
     .Background("transparent") 
     .Visible(true)); 
     series.Column(new double[] { 24, 21 }).Name("2010 Non Bah").Labels(labels => 
     labels.Template("#= series.name #") 
     .Background("transparent") 
     .Visible(true)); 

     series.Column(new double[] { 54, 5 }).Name("2011 Bah").Labels(labels => 
     labels.Template("#= series.name #") 
     .Background("transparent") 
     .Visible(true)); 

     series.Column(new double[] { 24, 21 }).Name("2011 Non Bah") 
     .Labels(labels => 
     labels.Template("#= series.name #")    
     .Background("transparent") 
     .Visible(true)); 

     series.Column(new double[] { 10, 52 }).Name("2012 Bah") 
     .Labels(labels => 
     labels.Template("#= series.name #") 
     .Background("transparent") 
     .Visible(true)); 

     series.Column(new double[] { 12, 65 }).Name("2012 Non Bah") 
     .Labels(labels => 
     labels.Template("#= series.name #") 
     .Background("transparent") 
     .Visible(true)); 
    }) 
    .CategoryAxis(axis => axis 
     .Categories("Male", "FeMale") 

     .Justify(true) 
    ) 

    .Tooltip(tooltip => tooltip 
     .Visible(true) 
     .Format("{0}") 
     .Template("#= series.name # : #= value #") 
    ) 
    ) 

回答

0

最後很多鬥爭,我發現解決方案

jsbin working example

$("#chart").kendoChart({ 
    seriesDefaults: { 
    type: "column" 
    }, 
    series: [{ 
    name: "Sales", 
    data: [10, 20, 0.5, 0, 100, 0] 
    }], 
    valueAxis: [{ 
    majorGridLines: { visible: false }, 
    title: { text: "Sales" }, 
    axisCrossingValue: [0,0] 
    }], 
    categoryAxis: [{ 
    categories: ["Order", "Invoice", "Credit Memo", "Order", "Invoice", "Credit Memo"], 
    majorGridLines: { visible: false } 
    }, 
       { 
    categories: ["Item", "Resources"], 
    line: { visible: true }, 
    majorGridLines: { visible: true }, 
    title: { text: "Type & Document Type" } 
    } 
       ] 
});