This project is read-only.

Para gerar um gráfico de colunas, bastará criar um controle 'ColumnChart' na sua página da seguinte forma:

 

<highchart:columnchart id="hcFrutas" width="600" height="400" runat="server"></highchart:columnchart>

 

Daí vamos criar as séries de dados e adicionar.

 

//configuracoes de titulos
hcFrutas.Title = new Title("Consumo de Frutas");
hcFrutas.SubTitle = new SubTitle("Agrupados por tipo de fruta");
 
//definicoes de eixos
hcFrutas.YAxis.Add( new YAxisItem { title = new Title("Unidades") });
hcFrutas.XAxis.Add( new XAxisItem { categories = new[] { "Macas", "Laranjas", "Peras", "Bananas", "Uvas" } });
 
//dados
var series = new Collection<serie>();
series.Add(new Serie { name = "Andre", data = new object[] { 4, 15, 5, 17, 14 } });
series.Add(new Serie { name = "Ivan", data = new object[] { 4, 25, 6, 12, 6 } });
series.Add(new Serie { name = "Marina", data = new object[] { 7, 19, 2, 34, 5 } });
series.Add(new Serie { name = "Camila", data = new object[] { 3, 14, 6, 21, 9 } });
 
//configuracoes de renderizacoes
hcFrutas.PlotOptions = new Core.PlotOptions.PlotOptionsColumn { borderColor = "#dedede", borderRadius = 4 };
 
//bind do controle
hcFrutas.DataSource = series;
hcFrutas.DataBind();

 

Podemos também adicionar Título, Subtítulo e várias configurações visuais.

Last edited Jan 18, 2012 at 9:06 PM by alrcastro, version 2

Comments

FabioFreitas Aug 20, 2012 at 3:02 PM 
Este projeto funciona com o FrameWorks 2.0?