2011-12-22 24 views
5

Estoy usando el Telerik Kendo Pie Chart y quiero poder colorear las cuñas.¿Cómo colorear las cuñas del gráfico circular de la interfaz de usuario Telerik Kendo?

La siguiente es la marca para mi gráfico de sectores Kendo UI:

<script type="text/javascript"> 
function createChart() { 
    jQuery("#chart").kendoChart({ 
     theme: jQuery(document).data("kendoSkin") || "Metro", 
     legend: { 
      position: "bottom" 
     }, 
     seriesDefaults: { 
      labels: { 
       visible: true, 
       format: "{0}%" 
      } 
     }, 

     series: [{ 
      type: "pie", 
      data: [{ 
       category: "Remaining Work", 
       value: 75, 
       explode: true 
      }, { 
       category: "CIOs", 
       value: 2 
      }, { 
       category: "Other Executives", 
       value: 10 
      }, { 
       category: "Directors and Physicians", 
       value: 13 
      }] 
     }], 
     tooltip: { 
      visible: true, 
      format: "{0}%" 
     } 
    }); 
} 

jQuery(document).ready(function() { 
    setTimeout(function() { 
     createChart(); 

     // Initialize the chart with a delay to make sure 
     // the initial animation is visible 
    }, 400); 

    jQuery(document).bind("kendo:skinChange", function (e) { 
     createChart(); 
    }); 
}); 
</script> 

Me gustaría que el trabajo restante sea de color gris claro. ¿Cómo logro esto?

Cualquier sugerencia sería apreciada.

Respuesta

18

En Kendo UI DataViz, todos los gráficos admiten la anulación de los colores del tema a través del seriesColors option. Esta propiedad tomará una matriz de cadenas de color hexadecimales. Por ejemplo:

$("#chart").kendoChart({ 
    ... 
    seriesColors: ["#7c7c7c", ... ] 
}); 
0
it is an implementation from server side would be very interesting on the concept of avoiding Similar shades..please look in to the below code which iam inserting to bind the pie chart with colors 
If Not radChart Is Nothing Then 
        radChart.PlotArea.EmptySeriesMessage.TextBlock.Text = strNoData 
        radChart.SkinsOverrideStyles = False 
        Dim seriesColors As Color() = {Color.Aqua, Color.Bisque, Color.Chartreuse, Color.Coral, Color.DarkCyan, Color.DarkKhaki, Color.DimGray, Color.Yellow, Color.LightGreen, Color.Magenta, Color.Orange, Color.Purple, Color.SaddleBrown, Color.Silver, Color.WhiteSmoke, Color.Violet, Color.RosyBrown, Color.Olive, Color.Navy, Color.IndianRed} 
        Dim seriesPalette As New Palette("seriesPalette", seriesColors, True) 
        radChart.CustomPalettes.Add(seriesPalette) 
        radChart.SeriesPalette = "seriesPalette" 
        radChart.DataBind() 
       End If 
Cuestiones relacionadas