2010-03-16 10 views
6

Próbuję utworzyć kontrolę wykresu .net całkowicie w kodzie za i wstawić wykres w określonej lokalizacji na stronie internetowej.Jak dodać wykres utworzony w kodzie do renderowanej strony html?

Oto moja strona html:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div id="chart"></div> 
    </form> 
</body> 
</html> 

Oto kod za:

using System; 
using System.Drawing; 
using System.Web.UI.DataVisualization.Charting; 

public partial class _Default : System.Web.UI.Page 
{ 
    protected void Page_Load(object sender, EventArgs e) 
    { 
     //SET UP THE DATA TO PLOT 
     double[] yVal = { 80, 20 }; 
     string[] xName = { "Pass", "Fail" }; 

     //CREATE THE CHART 
     Chart Chart1 = new Chart(); 

     //BIND THE DATA TO THE CHART 
     Chart1.Series.Add(new Series()); 
     Chart1.Series[0].Points.DataBindXY(xName, yVal); 

     //SET THE CHART TYPE TO BE PIE 
     Chart1.Series[0].ChartType = System.Web.UI.DataVisualization.Charting.SeriesChartType.Pie; 
     Chart1.Series[0]["PieLabelStyle"] = "Outside"; 
     Chart1.Series[0]["PieStartAngle"] = "-90"; 

     //SET THE COLOR PALETTE FOR THE CHART TO BE A PRESET OF NONE 
     //DEFINE OUR OWN COLOR PALETTE FOR THE CHART 
     Chart1.Palette = System.Web.UI.DataVisualization.Charting.ChartColorPalette.None; 
     Chart1.PaletteCustomColors = new Color[] { Color.Blue, Color.Red }; 

     //SET THE IMAGE OUTPUT TYPE TO BE JPEG 
     Chart1.ImageType = System.Web.UI.DataVisualization.Charting.ChartImageType.Jpeg; 

     //ADD A PLACE HOLDER CHART AREA TO THE CHART 
     //SET THE CHART AREA TO BE 3D 
     Chart1.ChartAreas.Add(new ChartArea()); 
     Chart1.ChartAreas[0].Area3DStyle.Enable3D = true; 

     //ADD A PLACE HOLDER LEGEND TO THE CHART 
     //DISABLE THE LEGEND 
     Chart1.Legends.Add(new Legend()); 
     Chart1.Legends[0].Enabled = false; 
    } 
} 

chcę renderować wykresów kontroli wewnątrz div id = "wykresu"

Dzięki za pomoc!

Odpowiedz

5

Zakładając, że zainstalowany framework do tworzenia wykresów bez zaczepów: -

Widok: -

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %> 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div id="chart"></div> 
     <asp:Chart id="Chart1" runat="server"/> 
    </form> 
</body> 
</html> 

kodzie: -

using System; 
using System.Drawing; 
using System.Web.UI.DataVisualization.Charting; 

public partial class _Default : System.Web.UI.Page 
{ 
    protected void Page_Load(object sender, EventArgs e) 
    { 
     //SET UP THE DATA TO PLOT 
     double[] yVal = { 80, 20 }; 
     string[] xName = { "Pass", "Fail" }; 

     //CREATE THE CHART 
     // Don't need to create the chart because it's a control! 

     //BIND THE DATA TO THE CHART 
     Chart1.Series.Add(new Series()); 
     Chart1.Series[0].Points.DataBindXY(xName, yVal); 

     //SET THE CHART TYPE TO BE PIE 
     Chart1.Series[0].ChartType = System.Web.UI.DataVisualization.Charting.SeriesChartType.Pie; 
     Chart1.Series[0]["PieLabelStyle"] = "Outside"; 
     Chart1.Series[0]["PieStartAngle"] = "-90"; 

     //SET THE COLOR PALETTE FOR THE CHART TO BE A PRESET OF NONE 
     //DEFINE OUR OWN COLOR PALETTE FOR THE CHART 
     Chart1.Palette = System.Web.UI.DataVisualization.Charting.ChartColorPalette.None; 
     Chart1.PaletteCustomColors = new Color[] { Color.Blue, Color.Red }; 

     //SET THE IMAGE OUTPUT TYPE TO BE JPEG 
     Chart1.ImageType = System.Web.UI.DataVisualization.Charting.ChartImageType.Jpeg; 

     //ADD A PLACE HOLDER CHART AREA TO THE CHART 
     //SET THE CHART AREA TO BE 3D 
     Chart1.ChartAreas.Add(new ChartArea()); 
     Chart1.ChartAreas[0].Area3DStyle.Enable3D = true; 

     //ADD A PLACE HOLDER LEGEND TO THE CHART 
     //DISABLE THE LEGEND 
     Chart1.Legends.Add(new Legend()); 
     Chart1.Legends[0].Enabled = false; 
    } 
} 

Wyjazd http://weblogs.asp.net/scottgu/archive/2008/11/24/new-asp-net-charting-control-lt-asp-chart-runat-quot-server-quot-gt.aspx

+0

@Na: Dziękuję za odpowiedź. Próbuję to zrobić bez posiadania tagu asp: chart na stronie aspx. – Ryan

+0

@Ryan: Jeśli jest to naprawdę konieczne, możesz użyć literału na stronie aspx i użyć Chart.RenderControl, aby ustawić jego właściwość tekstową, ale tak naprawdę nie widzę sensu. Jakiś konkretny powód, dla którego musisz zrobić to wszystko w ramach kodu? –

+0

Właśnie to zrobiłem. – Ryan

2

Dlaczego stosuje się renderowanie dynamiczne? Dlaczego nie wystarczy zdefiniować tag jako:

i ustaw atrybuty dotyczące kontroli? Alternatywnie możesz spróbować wstawić i ustawić tekst jako renderowaną odpowiedź, która zapakuje go w zakres. Możesz wypróbować inne elementy sterujące, aby to zrobić, jeśli wystąpi w tym błąd, na przykład w programie LiteralControl.

+0

@Brian: Jak zastosować wybraną odpowiedź do kodu, który mam powyżej. Jestem całkiem nowy w użyciu .NET ... Powoli próbuję się nauczyć obsługiwać .NET w przeciwieństwie do klasycznej ASP. Bardzo ważne jest, aby móc renderować wykres w określonej lokalizacji na stronie internetowej. Dzięki! – Ryan

+0

Przepraszam, myślałem, że mówisz MVC ... Przepraszam. Poprawiłem moją odpowiedź. –

1

spróbować umieścić w aspx:

div id="chart" runat="server" 

w kodzie:

this.chart.Controls.Add(Chart1); 

moim przypadku trzeba utworzyć więcej niż jeden z danymi z DataTable.

Powiązane problemy