Bonne approche pour la présentation des cartes en mvc3?

ai essayé quelques méthodes de présentation des tableaux en asp.net mvc, mais chacun a ses propres inconvénients, ne sachant toujours pas la meilleure approche pour présenter les cartesBonne approche pour la présentation des cartes en mvc3?

la première approche est en dessous d'un

public ActionResult Chart1() 
    { 
     Chart chart = new Chart(); 

     chart.ChartAreas.Add(new ChartArea()); 

     chart.Series.Add(new Series("Data")); 

     chart.Legends.Add(new Legend("Stores")); 
     chart.Series["Data"].ChartType =   SeriesChartType.Pie; 
     chart.Series["Data"].Points.AddXY(1.0, 5.0); 
     chart.Series["Data"].Points.AddXY(2.0, 9.0); 

     var returnStream = new MemoryStream(); 
     chart.ImageType = ChartImageType.Png; 
     chart.SaveImage(returnStream); 
     returnStream.Position = 0; 
     return new FileStreamResult(returnStream,   "image/png"); 
    } 

    view 

    <img src="/MyHome/Chart1" alt="" />

Par en utilisant la méthode ci-dessus im capable de présenter le tableau, comme la méthode d'action renvoie l'image directement, je ne suis pas en mesure de présenter des contrôles comme la zone de texte, bouton sur la même page du graphique

Y at-il une autre meilleure approche que ce?

Source

2012-09-05 being fab

Iam utilisant Razor.

Première Effectuer une vue uniquement pour rendre le contrôle de graphique similaire à celui-ci.

Charts.cshtml:

@{ 
     Layout = null; 
     var mychart = new Chart(width: 300, height: 300) 
      .AddTitle("Employee Chart") 
      .AddSeries(
       chartType: "Bubble", 
       name: "Employee", 
       xValue: new[] { "Peter", "Andrew", "Julie", "Dave" }, 
       yValues: new[] { "2", "7", "5", "3" });    

    } 
    <!DOCTYPE html> 
    <html> 
    <head> 
     <title>Charts</title> 
    </head> 
    <body> 
     <div> 
      @mychart.Write(); 
     </div> 
    </body> 
    </html>

Faites ensuite une vue où vous voulez placer votre contrôle graphique.

Vue principale:

@{ 
    Layout = null; 
} 

<!DOCTYPE html> 

<html> 
<head> 
    <title>MainView</title> 
</head> 
<body> 
    <div> 
     <img src="Charts"/> //Here src value must be the URL of your chart view. 
    </div> 
    <div> 
    <input type="button" name="Button"/> 
    </div> 
</body> 
</html>

Maintenant votre image est revenu de votre point de vue graphique est rendu en img vous indiquez dans votre vue main.

Vous faites également une vue partielle pour obtenir une optimisation.

Source

2012-09-05 07:00:40 SMK

Il ne doit pas pointer la source d'image à l'URL de la vue les graphiques, car elle rend également HTML. Au contraire, il devrait le rendre via @ Html.Partial ("Graphiques"). Mieux encore, évitez que la vue ne contienne une logique de rendu pour le graphique et créez plutôt un modèle fortement typé que le contrôleur remplit, et laissez uniquement la vue Chart.cshtml afficher la vue. De cette façon, il pourrait aussi faire un DisplayTemplate pour le modèle de graphique et le rendre avec @ Html.DisplayFor (model => model.Chart) –

le problème dans mon code est, la vue n'est pas appelée comme méthode d'action "return new FileStreamResult (returnStream, "image/png"); renvoie l'image, de sorte que la vue ne soit pas appelée. –

@SMK: J'ai une requête concernant les étiquettes affichées dans le graphique.Si nous utilisons un graphique à colonnes, et si nous avons un certain nombre de colonnes, alors le graphique n'affiche que l'étiquette de chaque colonne. Que devrait-on faire pour montrer chaque étiquette de colonne? –

Faire un modèle fortement typé pour la vue où vous voulez que le graphique à apparaître:

public class SomeViewWithAChartModel { 
    // Other model data goes here 

    public Chart Chart { get; set; } // <---- Add this 
}

Demandez à votre remplissage d'action du contrôleur et de retour ceci à votre point de vue, chaque fois que vous voulez afficher un graphique:

public ActionResult SomeViewWithAChart() 
    { 
     var chart = new Chart() 
     // Set chart specifics... 

     var model = new SomeViewWithAChartModel { Chart = chart }; 

     return View(model); 
    }

Créez une vue partielle pour afficher le graphique avec les éléments HTML que vous souhaitez afficher.

Chart.cshtml vue partielle:

@model Chart 

<div> 
    @Model.Write(); 
</div> 
<div> 
    <input type="button" value="Tada! /> 
</div>

Render la carte-vue partielle dans les vues où vous voulez que votre graphique apparaisse, ainsi que le « Tada! » bouton, par exemple notre vue SomeViewWithAChart:

SomeViewWithAChart.cshtml:

<!DOCTYPE html> 

<html> 
<head> 
    <title>Some View with a chart and a button</title> 
</head> 
<body> 
    @Html.Partial("Chart", Model.Chart) 
</body> 
</html>

Source

2012-09-05 08:40:43

mon action de contrôleur renvoie l'image, "retour nouveau FileStreamResult (returnStream," image/png ");", comment puis-je ajouter la vue de retour dans ma méthode d'action? –

En modifiant l'action de votre contrôleur pour renvoyer la classe de modèle contenant le diagramme. Remplacez simplement "return new FileStreamResult (...);" avec "retour vue (modèle);" –

Bonne approche pour la présentation des cartes en mvc3?

Répondre

Questions connexes