Array
(
)

Posicionar gráfico no centro

Pjava
   - 23 abr 2012

Tenho uma página com seguinte layout:
DIV -> Topo(Cabeçalho)
DIV -> Corpo(Gráfico de botões)
DIV -> Rodapé
Preciso informar a minha página, que o meu gráfico vai iniciar na DIV -> Corpo. Eu preciso fazer isso, porque do jeito que está os tres botões estão iniciando em cima do gráfico e não em baixo, conforme o layout me passado. Como eu faço isso? Abaixo o cófigo:
<head runat=server>
<title></title>
<link href=~/Style/FrameWork.css type=text/css rel=stylesheet />
</head>
<body>
<form id=form1 runat=server>
<div class=topo>
<cc1:FControl ID=FControl1 runat=server Arquivo=~/FrameWork/CabecalhoLogin.ascx
Controle=Pagebanner />
</div>

<div class=conteudo>
<table width=60% style=margin-left:20%;margin-right:10%>
O gráfico deve aparecer aqui e os botões em baixo.
<tr align=right>
<td>
<asp:Button runat=server ID=btnImprimir Text=Imprimir class=buttonLogin100 Width=60px />
 
 
<asp:Button runat=server ID=btnSalvar Text=Salvar class=buttonLogin100 Width=60px />
 
 
<asp:Button runat=server ID=btnVoltar Text=Voltar class=buttonLogin100 Width=60px ForeColor=/>
</td>
</tr>
</table>
<div class=rodape>
<cc1:FControl ID=FControl2 runat=server Controle=Rodape></cc1:FControl>
</div>
</form>
</body>

Pjava
   - 23 abr 2012

Em realidade preciso fazer com que o gráfico inicie na <div class=conteudo>

Joel Rodrigues
   - 23 abr 2012

Bom, tente definir o atributo runat=server e dê um id pra div do meio, no seu código então você faz referência a ela.
Uma pergunta: por que você já não coloca o tal gráfico ali e altera apenas os dados via C#?

Pjava
   - 24 abr 2012

Como eu faço isso Joel? Sou meio cru ainda com C#, mas estou achando legal trampar com ele. Mas ainda preciso aprender algumas coisas e a melhor forma é essa, fazendo algo real. Abaixo meu código C# desse gráfico.

#Código protected void Page_Load(object sender, EventArgs e)
{
int codUsuario = 123;
DesempenhoMensalBL bl = new DesempenhoMensalBL();
bl.Execute(codUsuario);

//Cria o objeto Chart, base de todos os gráficos
RadChart radChart1 = new RadChart();
radChart1.ChartTitle.TextBlock.Appearance.Position.AlignedPosition = Telerik.Charting.Styles.AlignedPositions.Center;
radChart1.ChartTitle.TextBlock.Text = EVOLUÇÃO MENSAL APROVADAS DÉBITO;

//Muda a cor de fundo do gráfico para transparente
radChart1.Appearance.FillStyle.FillType = Telerik.Charting.Styles.FillType.Solid;
radChart1.Appearance.FillStyle.MainColor = System.Drawing.Color.Transparent;
radChart1.PlotArea.Appearance.FillStyle.FillType = Telerik.Charting.Styles.FillType.Solid;
radChart1.PlotArea.Appearance.FillStyle.MainColor = System.Drawing.Color.Transparent;
this.Controls.Add(radChart1);

RadChart radChart2 = new RadChart();
radChart2.ChartTitle.TextBlock.Text = EVOLUÇÃO MENSAL APROVADAS CRÉDITO;

//Muda a cor de fundo do gráfico para transparente
radChart2.Appearance.FillStyle.FillType = Telerik.Charting.Styles.FillType.Solid;
radChart2.Appearance.FillStyle.MainColor = System.Drawing.Color.Transparent;
radChart2.PlotArea.Appearance.FillStyle.FillType = Telerik.Charting.Styles.FillType.Solid;
radChart2.PlotArea.Appearance.FillStyle.MainColor = System.Drawing.Color.Transparent;
this.Controls.Add(radChart2);

ChartSeries chartSeries1 = radChart1.CreateSeries(Débito-Master, System.Drawing.Color.Red, System.Drawing.Color.Red, ChartSeriesType.Bar);
ChartSeries chartSeries2 = radChart2.CreateSeries(Crédito-Master, System.Drawing.Color.Red, System.Drawing.Color.Red, ChartSeriesType.Bar);
ChartSeries chartSeries3 = radChart1.CreateSeries(Débito-Visa, System.Drawing.Color.Silver, System.Drawing.Color.Silver, ChartSeriesType.Bar);
ChartSeries chartSeries4 = radChart2.CreateSeries(Crédito-Visa, System.Drawing.Color.Silver, System.Drawing.Color.Silver, ChartSeriesType.Bar);

ChartSeries chartSeries5 = radChart1.CreateSeries( , System.Drawing.Color.Black, System.Drawing.Color.Black, ChartSeriesType.Line);
ChartSeries chartSeries6 = radChart2.CreateSeries( , System.Drawing.Color.Black, System.Drawing.Color.Black, ChartSeriesType.Line);

chartSeries1.Type = ChartSeriesType.Bar;
chartSeries2.Type = ChartSeriesType.Bar;
chartSeries3.Type = ChartSeriesType.Bar;
chartSeries4.Type = ChartSeriesType.Bar;

chartSeries5.Type = ChartSeriesType.Line;
chartSeries6.Type = ChartSeriesType.Line;

//A orientação do gráfico
radChart1.SeriesOrientation = ChartSeriesOrientation.Vertical;
radChart2.SeriesOrientation = ChartSeriesOrientation.Vertical;

//Tamanho da área do gráfico em pixels
radChart1.Height = 200;
radChart1.Width = 800;

radChart2.Height = 200;
radChart2.Width = 800;

chartSeries1.SetValues(bl.doubleArrayDebitoMaster);
chartSeries3.SetValues(bl.doubleArrayDebitoVisa);

chartSeries2.SetValues(bl.doubleArrayCreditoMaster);
chartSeries4.SetValues(bl.doubleArrayCreditoVisa);

chartSeries5.SetValues(bl.doubleArrayDebito);
chartSeries6.SetValues(bl.doubleArrayCredito);

}
}
}


Meu código ASPX, onde deveria subir o gráfico

#Código<body>
<form id=form1 runat=server>
<div class=topo>
<cc1:FWServerControl ID=FWServerControl1 runat=server Arquivo=~/Modulos/FrameWork/CabecalhoLogin.ascx
Controle=Pagebanner />
</div>

<div class=conteudo>

<table width=60% style=margin-left:20%;margin-right:10%>
<tr align=right>
<td>
<asp:Button runat=server ID=btnImprimir Text=Imprimir class=buttonLogin100 Width=60px />
 
 
<asp:Button runat=server ID=btnSalvar Text=Salvar class=buttonLogin100 Width=60px />
 
 
<asp:Button runat=server ID=btnVoltar Text=Voltar class=buttonLogin100 Width=60px ForeColor=/>
</td>
</tr>
</table>
</div>

<div class=rodape>
<cc1:FWServerControl ID=FWServerControl2 runat=server Controle=Rodape></cc1:FWServerControl>
</div>

</form>
</body>

Pjava
   - 24 abr 2012

Faltou dizer que o gráfico sobe na DIV conteudo.

Joel Rodrigues
   - 24 abr 2012

Bem, o que eu quis dizer foi o seguinte:
1) Primeiramente definir os atributos da div para que ela seja reconhecida no lado servidor.
#Código
<div id=divConteudo runat=server>
</div>


2) No code behind (no arquivo C#), você criaria seu gráfico e depois adicionaria à div.
#Código
divConteudo.Controls.Add(meuGraficoJaCriado);


Não testei, mas faz sentido. Teste aí e veja no que dá.

Joel Rodrigues
   - 24 abr 2012

Com relação à minha pergunta, a ideia era declarar o gráfico já no HTML e referenciá-lo no C#. Ficaria algo parecido com isso:
#Código
<body>
<div id=divTopo></div>

<div id=divConteudo>
<tag_do_grafico id=meuGrafico runat=server/>
</div>

<div id=divRodape></div>

</body>


Então você alteraria as propriedades do gráfico pelo código C#:
#Código
meuGrafico.Propriedade = valor;


Boa sorte.

Joel Rodrigues
   - 24 abr 2012

Confesso que essa forma de trabalhar eu descobri sozinho, fazendo testes, ´´fuçando´´ a linguagem, mas pra você que está começando, tem uns bons livros que indico:
- Visual C# 2010 - Step by Step
- ASP.NET 4 Unleashed

Boa sorte em seus projetos.