Neue asp.net-Diagrammsteuerelemente - funktionieren sie (irgendwann) mit MVC?

Antworten:

94

Sie können die Diagrammsteuerelemente auf zwei Arten verwenden:

Generieren des Images von einem Controller

Durch Generieren des Diagramms und Zurückgeben als Bild aus einer Aktion (wie Chatuman meiner Meinung nach meint):

Chart chart = new Chart();
chart.BackColor = Color.Transparent;
chart.Width = Unit.Pixel(250);
chart.Height = Unit.Pixel(100);

Series series1 = new Series("Series1");
series1.ChartArea = "ca1";
series1.ChartType = SeriesChartType.Pie;
series1.Font = new Font("Verdana", 8.25f, FontStyle.Regular);
series1.Points.Add(new DataPoint { 
                AxisLabel = "Value1", YValues = new double[] { value1 } });
series1.Points.Add(new DataPoint {
                AxisLabel = "Value2", YValues = new double[] { value2 } });
chart.Series.Add(series1);

ChartArea ca1 = new ChartArea("ca1");
ca1.BackColor = Color.Transparent;
chart.ChartAreas.Add(ca1);

using (var ms = new MemoryStream())
{
    chart.SaveImage(ms, ChartImageFormat.Png);
    ms.Seek(0, SeekOrigin.Begin);

    return File(ms.ToArray(), "image/png", "mychart.png");
}

WebForms-Stil

Auf diese Weise fügen Sie das Diagramm einfach in Ihre ASPX-Ansichten ein (genau wie bei herkömmlichen Webformularen). Dazu müssen Sie die relevanten Bits in Ihrer web.config einbinden

<controls>
    ...
    <add tagPrefix="asp"
         namespace="System.Web.UI.DataVisualization.Charting"
         assembly="System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
</controls>

<httpHandlers>
    ...
    <add path="ChartImg.axd"
         verb="GET,HEAD"
         validate="false"
         type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" />
</httpHandlers>

<handlers>
    ...
    <add name="ChartImageHandler"
         preCondition="integratedMode" 
         verb="GET,HEAD"
         path="ChartImg.axd"
         type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35"/>
</handlers>

Sie können beim Erstellen des Diagramms keinen Code in den DataPoint-Elementen ausführen. Um Ihre Daten zu verknüpfen, benötigen Sie eine Methode in der View-Klasse. Das funktioniert bei mir gut. Auf diese Weise rendert das Steuerelement eine URL zu einem Bild, das vom http-Handler des Diagrammsteuerelements generiert wurde. In Ihrer Bereitstellung müssen Sie einen beschreibbaren Ordner bereitstellen, damit die Bilder zwischengespeichert werden können.

* VS 2010 / .NET 4-Unterstützung *

Damit dies in .NET 4 funktioniert, müssen Sie die Diagrammverweise auf Version 4.0.0.0 mit dem entsprechenden Token für den öffentlichen Schlüssel ändern.

Außerdem scheint das Diagrammsteuerelement jetzt URLs zum aktuellen Anforderungspfad und nicht zur Anforderungsroute zu generieren. Für mich bedeutete dies, dass alle Kartenanfragen zu 404 Fehlern führten, weil /{Controller}/ChartImg.axdund Äquivalente durch Routen blockiert wurden. Um dies zu beheben, habe ich zusätzliche IgnoreRoute-Aufrufe hinzugefügt, die meine Verwendungszwecke abdecken. Eine allgemeinere Lösung wäre besser:

public static void RegisterRoutes(RouteCollection routes)
{
    routes.IgnoreRoute("ChartImg.axd/{*pathInfo}");
    routes.IgnoreRoute("{controller}/ChartImg.axd/{*pathInfo}");
    routes.IgnoreRoute("{controller}/{action}/ChartImg.axd/{*pathInfo}");
...
Simon Steele
quelle
12
+1 - schön. 2 kleine Änderungen: MemoryStream ms = new MemoryStream()sollten in einem usingBlock sein, und MVC-Controller hat Hilfsmethoden für die Rückgabe von Dateien - anstatt new FileStreamResultSie könnenreturn File(ms.ToArray(), "image/png", "mychart.png")
Keith
1
Es wurden Informationen hinzugefügt, damit dies in .NET 4 funktioniert. Ich habe ewig gebraucht, um die Routensache herauszufinden!
Simon Steele
4
Ich habe gerade eine für .net 4.0 aktualisierte Version der Diagrammbeispiele in meinem Blog veröffentlicht und zwei weitere Projekte eingebracht - ChartsWithMVC und ChartsWithoutWebForms, die beide das Diagramm im Grunde genommen als Bild rendern und zurückgeben. develocity.blogspot.com/2010/04/…
Dave Haynes
1
Gibt es eine andere Möglichkeit, um Microsoft Charts interaktiv und Ajax-Unterstützung zu verwenden? Ich benutze MVC 4
kbvishnu
Zusätzliche Informationen, die jemandem helfen können: Wenn sich Ihre Diagramme in einem Bereich befinden, müssen Sie RegisterArea die Ignorierungen (context.Routes.Ignore ("{controller} / {action} /ChartImg.axd / {* pathInfo}")) hinzufügen Methode auch
Fiona - myaccessible.website
12

Informationen zu Personen, die die Diagrammsteuerung mit MVC 3 mithilfe der Razor Engine verwenden möchten, finden Sie unter folgendem Link

Verwendung von MS Charts mit MVC3 mit Razor

Sarath
quelle
2

Sie können sie bereits mit MVC verwenden. Sie müssen sie lediglich als Bilder rendern

Chatu
quelle
1

Erstellen Sie stattdessen eine Benutzersteuerung, geben Sie ihr das vollständige Diagrammobjekt und lassen Sie es sich selbst rendern:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl<System.Web.UI.DataVisualization.Charting.Chart>" %>
<%
    Model.Page = this.Page;
    var writer = new HtmlTextWriter(Page.Response.Output);
    Model.RenderControl(writer);
%>

Nennen Sie es Chart.ascx und legen Sie es in Ihrem Ordner für die freigegebene Ansicht ab.

Jetzt erhalten Sie alle zusätzlichen HTML-Dateien wie Image Map usw. kostenlos .. sowie Caching.

in Ihrem Controller:

public ActionResult Chart(){
 var c = new Chart();
 //...
 return View(c);
}

aus Ihrer Sicht:

<% Html.RenderPartial("Chart", Model); %>
Carl Hörberg
quelle
Ich erhalte eine Reihe von Fehlern, die ich NIE gesehen habe, bevor ich diese Methode verwendet habe. Die erste ist Error executing child request for ChartImg.axd.- können Sie dabei helfen?
Jimbo
Benutzer haben vorgeschlagen <add path="ChartImg.axd" verb="GET,HEAD" type="System.Web.UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35" validate="false" />, der web.config unter dem <httpHandlers>Abschnitt etwas hinzuzufügen. Dies führt jedoch zu einem weiteren Fehler. Ist Session state has created a session id, but cannot save it because the response was already flushed by the application.dies auch in Ihrer Implementierung aufgetreten ?
Jimbo
Verwenden Sie .NET 4.0 oder 3.5? Wenn Sie 3.5 verwenden, müssen Sie das Material zu web.config hinzufügen, wie es stackoverflow.com/questions/319835/… vorschlägt.
Carl Hörberg
Wenn Sie .NET 4.0 verwenden, fügen Sie Folgendes hinzu: <system.webServer> <handlers> <add name = "ChartImageHandler" preCondition = "IntegratedMode" path = "ChartImg.axd" verb = "GET, HEAD" type = "System.Web .UI.DataVisualization.Charting.ChartHttpHandler, System.Web.DataVisualization, Version = 4.0.0.0, Culture = neutral, PublicKeyToken = 31bf3856ad364e35 "/> </ handlers> <system.webServer> und <appSettings> <add key =" ChartImageHandler "value =" storage = file; timeout = 20; " /> </ appSettings sowie RouteIgnore vorgeschlagen von Simon Steele
Carl Hörberg
JA danke Carl! Funktioniert für mich in MVC 4 und NET 4.5 VS2012. Eine einfache Möglichkeit, die web.config-Elemente zu generieren, besteht darin, einfach den Projektmappen-Explorer zu verwenden, um dem MVC 4-Projekt ein neues WebForm.aspx-Element hinzuzufügen. Ziehen Sie dann aus der Toolbox ein Diagrammsteuerelement auf die Aspx-Entwurfsoberfläche. Fügen Sie zu App_Start / RouteConfig.cs den Code hinzu, um die von Simon Steele gezeigten Routen zu ignorieren.
Subsci
1

Dieser Artikel hat für mich am besten geklappt:

http://www.codecapers.com/post/Build-a-Dashboard-With-Microsoft-Chart-Controls.aspx

Gibt keine Fehler zu "Objekt nicht auf eine Instanz eines Objekts festgelegt" oder "Sitzungs-ID war verfügbar, aber der Antwortstrom wurde gelöscht" (nicht der genaue Wortlaut der Fehler).

Ich war nicht bereit, sie nur als Bild zu rendern, denn wenn Sie Drilldowns, QuickInfos oder andere Klickaktionen im Diagramm ausführen, wird beim Rendern als Bild nichts davon beibehalten.

Der Schlüssel für meine Anforderungen bestand darin, die Diagramme in ein Modell einzufügen, das Modell an die Ansicht (oder Teilansicht) zu übergeben und ein asp: -Feld in die Ansicht einzufügen und die Diagramme dem Feld in der Ansicht hinzuzufügen Markup.

Dies war übrigens bei VS.net 2008 und MVC 2 am 3. September 2010 (Daten waren etwas, das ich bei der Suche nach Antworten aufgrund der Änderungen, die ständig an MVC vorgenommen werden, als wichtig empfand).

Darryl
quelle
0

Ich habe mit MVC getestet und bisher sieht es so aus, als würde es mit MVC funktionieren.

Picflight
quelle