Creación de gráficos en ASP.Net MVC 3

Question

Estoy usando Chart web helper en ASP.Net MVC 3. He visto una serie de imágenes brillantes en línea que muestran las capacidades de esta API, pero apenas hay documentación sobre cómo diseñar el cuadros. Por ejemplo, necesito mostrar etiquetas fuera del gráfico, me gustaría especificar porcentaje, en lugar de valores decimales, etc.

Hay un proyecto de formularios web para descargar: http://weblogs.asp.net/scottgu/archive/2010/02/07/built-in-charting-controls-vs-2010-and-net-4-series.aspx y una documentación de clase muy simple que explica cómo asignar valores y especificar dimensiones básicas.

Entiendo que aún no se han publicado libros en MVC 3, pero seguramente debería haber algún tipo de documentación que explique cómo usar la herramienta.

Gracias

EDIT:

De lo que he leído, ASP.Net MVC 3 tampoco dio un paso atrás con la herramienta de gráficos mediante la eliminación de la capacidad de estilo de gráficos, o no se ha documentado en absoluto. Encontré este artículo: http://forums.asp.net/t/1620783.aspx/1?ASP+NET+MVC+3+Beta+Chart+Helper+Styling+Please+Help+, aquí se describe un problema muy similar.

EDIT 2: Parece que Microsoft ha implementado parcialmente funcionalidad MSCharts en MVC 3. Con el fin de utilizar MSCharts, el conjunto System.Web.DataVisualization debe ser importado y registrado en el archivo web.configuration. T

De esta manera, las solicitudes se envían desde la vista a los controladores. Los controladores generan una imagen de un gráfico y transmiten un resultado de imagen. El resultado se muestra en la vista. Esto es útil ya que proporciona algún tipo de separación. Todavía no entiendo por qué System.WebHelpers.Chart ya no ofrece esta funcionalidad, pero espero que se aborde en un futuro próximo.

EDIT 3: Pocos puntos más para hacer. No construya sus gráficos en la vista; deben ser servidos por un controlador. Si decide usar vistas para construir gráficos, asegúrese de actualizar web.config en la carpeta Vistas para incluir <add namespace="System.Web.UI.DataVisualization"/> en la sección de espacio de nombres. Los nombres de ensamblados y espacios de nombres son un poco confusos. El ensamblado se llama: System.Web.DataVisualization cuando el espacio de nombres se llama System.Web.UI.DataVisualization. Finalmente, creo que la API de gráficos es excelente, sirve imágenes, lo que significa que se podrá acceder a los gráficos desde todos los navegadores web. La calidad de los cuadros es excelente. He analizado alternativas como Fusion Charts, HighCharts y algunos otros gráficos con jQuery/JavaScript/Flash. Todos ellos tratan de tomar £ 300- £ 1000 de usted sin tratar de satisfacer las necesidades más básicas de los desarrolladores.

Answer 1

Los controles de gráfico se basan en un proyecto previamente separado llamado MS Chart.

Blog (dev plomo MSFT para el proyecto) de Alex Gorev: http://blogs.msdn.com/b/alexgor/

MS Gráfico Foros: http://social.msdn.microsoft.com/Forums/en-US/MSWinWebChart/

documentación en MSDN: http://msdn.microsoft.com/en-us/library/dd456632(VS.100).aspx

Los mensajes parecer un poco fuera de fecha, pero el API es prácticamente la misma entre MS Chart y las nuevas bibliotecas de visualización de datos.

Para hacer frente a sus preguntas ejemplo:

1) para mostrar las etiquetas fuera del gráfico, cada Series objeto tiene una matriz de diccionario de propiedades.

series["PieLabelStyle"] = "Outside";

2) Para especificar porcentajes en lugar de valores en bruto, propiedad Label del objeto Series toma una cadena de formato.

series.Label = "#PERCENT{P0}"

Estos atributos personalizados están disponibles en detalle http://msdn.microsoft.com/en-us/library/dd456764.aspx.

EDIT: Adición Ejemplo Código

Bueno, aquí está un ejemplo de código completo. Estoy usando System.Web.DataVisualization v4.0.0.0, por lo que esto debería ser actual con MVC 3. El series enumerado anteriormente no es el Chart.Series propiedades reales (que es un SeriesCollection). Es el individuo series que está agregando a esa colección.

public ActionResult TestForSOExample() 
{ 
    // slug in some data 
    var data = new Dictionary<string, float> 
     { 
      {"test", 10.023f}, 
      {"test2", 20.020f}, 
      {"test3", 19.203f}, 
      {"test4", 4.039f}, 
      {"test5", 5.343f} 
    }; 


    var chart = new Chart(); 

    var area = new ChartArea(); 
    // configure your chart area (dimensions, etc) here. 
    chart.ChartAreas.Add(area); 

    // create and customize your data series. 
    var series = new Series(); 
    foreach (var item in data) 
    { 
     series.Points.AddXY(item.Key, item.Value); 
    } 
    series.Label = "#PERCENT{P0}"; 
    series.Font = new Font("Segoe UI", 8.0f, FontStyle.Bold); 
    series.ChartType = SeriesChartType.Pie; 
    series["PieLabelStyle"] = "Outside"; 

    chart.Series.Add(series); 

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

Cuando llama la acción del controlador, se le presentan las siguientes imágenes.

Answer 2

recomendaría para hacer tablas en el cliente, en lugar de que hacer en el servidor, el servidor es en realidad se debe utilizar para tirar de los datos. Yo usaría smth como google charts para eso. Pero si realmente está decidido a extraer gráficos del servidor, las imágenes son específicas, entonces lo más fácil es usar el enfoque anterior: clase de gráfico. Pero una desventaja de este enfoque es que no hay diseñador para eso, pero en realidad, como descubrí, si creas la aplicación WinForms y arrastras y sueltas el control de Gráficos, es exactamente lo mismo y hay un diseñador para eso, todo es necesario copiar/pegar código generado por el diseñador y escribir alguna lógica de procesamiento, si es necesario. Hace la vida mucho más facil.