He aquí un simple pero extenso listado de componentes para insertar gráficos en ASP.NET, pero no solo queda ahí sino también para insertar gráficos en paginas HTML mediante Javascript, Flash, Silverlight y hasta con puro CSS.
Hace bastante tenia este post en "borrador" hasta que un amigo virtual (eso que uno gana en los newsgroup y foros) Javier Santamaría me dio pie para postearlo por aquí para tenerlos de referencia.
También por que en estos días mi amiga Gabriela necesitaba mostrar sus datos de su sistema de encuesta, retome de nuevo este post.
Al mejor estilo de listado como de articulo anterior:
Manuales, libros, enlaces sobre ASP.NET 2.0
Aquí se viene un recopilación de componentes para crear gráficos en ASP.NET...algunos son componentes del lado del servidor que nos ayudan a renderizar en gráficos de imagen, Javascript , Flash y/o Silverlight
El orden aquí no es importante, es decir no es que recomiendo el primero de cada lista. Solo que asi ya quedo guardado mientras lo iba completando al post. Para cada caso particular y como el desarrollador se sienta mas "comodo/a gusto" y por supuesto los requerimientos del usuario final.
NOTA: Si deseas insertar otro mas… escríbeme un comentario
FREE
- Microsoft Chart Controls for Microsoft .NET Framework 3.5
- WebChart - Free Chart control for ASP.NET (renderiza en imagen png, jpg, gif)
- Logi Report
- ASP.NET Resource Kit (aqui venían componente comerciales con licencia free, habia que registrarse, pero ya quedo en la historia. No están disponibles los enlaces)
- Reports Starter Kit (ejemplo de graficos como imagen para utilizar)
- Nplot - Free charting library for .NET (para asp.net y para winform)
- WebChart: Roll your own ASP.NET Chart Control (CodeProject)
- ZedGraph. (Recomendación de Javier Santamaría)
- Basados en Flash:
- FusionCharts Free v2 (gráficos en Flash y XML, no es un componente)
- amCharts (graficos en Flash, componente para ASP.NET)
- Open Flash Chart y ASP.NET (en Flash)
- Gráficas Flash para todos. Basados en XML y Flash (free)
- XML/SWF Charts
- Basados en Silverlight
- VISIfire. Open Source Data Visualization Component
- Silverlight Toolkit
- Silverlight 2.0 Pie Chart (Beta)
- Basados en javascript:
- jQuery: fgCharting
- jQuery: jqChart
- jQuery: Sparkline . Incrustar pequeños graficos inline
- jQuery: Flot. Flot is a pure Javascript plotting library for jQuery.
- Emprise JavaScript Charts. La versión personal es free
- PlotKit - Javascript Chart
- AjaxMGraph (XHTML y CSS)
- WebFx Chart
- Basados en CSS:
- Dynamic Pie Chart with CSS
- SAC Simple Accessible Charts
- CSS for bar graph
- Bar Chart with CSS
- Frameworks para graficar en web
- Google Chart API
- Google Visualization API Gallery
- Yahoo! UI Library: Charts
- Mas componentes para graficar
http://www.asp.net/community/control-gallery/browse.aspx?category=7
MANUALMENTE ("artesanalmente")
Utilizando System.Drawing…
COMERCIALES
- Dundas Charts
- ComponentoONE
- ChartDirector for .NET.
- Nevron Chart for .NET
- Infragistics
- .netCHARTING
- Office Web Components (COM)
- Software Siglo XXI team
- RChart 2.1 for .NET
...con mas detalle...
FREE
-
Microsoft Chart Controls for Microsoft .NET Framework 3.5
Por fin Microsoft saca su propio componente de controles (mmm! es Dundas Chart por si te parece conocida la interfaz)… todavía no lo utilice. Hace un par de días nos comentaba elBruno en este articulo:
Ejemplos: Samples Environment for Microsoft Chart Controls (ASP.NET y Winform)
Algunos enlaces:
-
WebChart - Free Chart control for ASP.NET
Reportes basados en XML. Interesante herramienta para generar reportes y exportarlos a muchos formatos (Excel, Word, CSV, HTML y PDF), y poder tener acciones/eventos a una fila/encabezado o reporte completo. Podemos generar a partir de un template de PDF o Excel.
Integración con .NET/J2EE, ASP.NET

Requerimientos:
- Microsoft Internet Information Server (IIS)
- Microsoft .NET Framework
- MDAC 2.7 or higher (Windows 2003 has MDAC 2.8 preinstalled)
- ODBC or OLEDB compliant database (such as MSDE, SQL server, or Oracle) connectivity
Aquí ya toco de oído, porque este enlace en alguno momento lo comentaron los newsgroups. Ahora no funciona, lo dejo por aqui para “recordarlo”.
Un poco de historia….No se si esto servirá para asp.net 2.0, pero bueno lo dejo por aqui para que si alguien lo lee conozca que algunas vez teniamos componentes comerciales free!! (ComponentOne Studio for ASP.NET, Infragistics WebGrid part of NetAdvantage 2004, IP*Works! CC ICharge Component, Sax.net Security for ASP.NET, telerik r.a.d.rotator and r.a.d. spell components.)
ASP.NET Resource Kit trae el ComponentOne Studio for ASP.NET con licencia, pero hay que registrarse (y la web para registrarse ya no funciona)
http://msdn.microsoft.com/asp.net/asprk/ >> este enlace ya no funciona ;( ahora es aquí (un poco mas largo)
http://www.microsoft.com/downloads/details.aspx?FamilyID=aef6aa76-ab88-4264-87b4-8e946ef584d7&displaylang=en
- Enlaces sobre ASP.NET Resource Kit:
(Esto lo aporto el gran Juan T. Llibre) Aquí dentro tenemos ejemplos de gráficos... parece que amándolo artesanalmente. Pero podemos aprovechar el ejemplo para nuestros proyectos.
http://www.asp.net/StarterKits/DownloadReports.aspx?tabindex=0&tabid=1
-
Nplot - Free charting library for .NET
Esto lo vi pero nunca lo llegue a probar tanto para ASP.NET como para Winform.
http://netcontrols.org/nplot/wiki/
Estadísticas de su utilización(Febrero 2008) http://www.scimatic.com/?q=node/229
-
WebChart: Roll your own ASP.NET Chart Control (Codeproject)
Es un poco antiguo el articulo Junio/2003, pero por ahí puede alguien modificar para utilizarlo en proyectos de ASP.NET 2.0
Url: http://www.codeproject.com/KB/custom-controls/webchart.aspx
URL: http://zedgraph.org/wiki/index.php?title=Main_Page
Articulo en CodeProject: A flexible charting library for .NET (by JChampion)
Aqui hay que escribir un poco de XML, ya que los gráficos son película flash que hay que enviarles los datos y configuración mediante un xml, ya sea por querystring, o por flashvar. O sea no esta integrado a nuestor IDE, pero nos brinda de un modo sencillo poder incrustar gráficos rápidamente.
Al igual que el anterior paquete, amChart renderiza con una película flash, que podemos cargarla desde un xml, dentro de la misma pagina, o recuperarlo desde un url diferente, logrando así que nuestro gráfico sea dinámico y muy estilizado.
Aqui si existe un componente para ASP.NET para manipularlo desde el codigo, para no estar generando esos lindos tag de xml, y para enlazarlos a nuestros proveedores de datos.
-
Open Flash Chart y ASP.NET
Basados en un articulo en buayacorp, sobre estas dos tecnologías.
Url del articulo: http://www.buayacorp.com/archivos/graficos-con-open-flash-chart-y-aspnet/
Open Flash: http://teethgrinder.co.uk/open-flash-chart/
Open Flash Librería para .NET: http://teethgrinder.co.uk/open-flash-chart/dot-net.php
(existen para Java, Perl, Python, Ruby and Rails y PHP…)
Solución en Visual Studio 2008 (del articulo de Alex en buayacorp)
-
Gráficas Flash para todos
XML y Flash.. listo para utilizar
URL: http://www.soitu.es/soitu/2008/03/25/met/1206461193_108279.html

XML y Flash.. listo para utilizar
URL: http://www.maani.us/xml_charts/index.php
Licencia: http://www.maani.us/xml_charts/index.php?menu=License
-
VISIfire. Open Source Data Visualization Component (Powered by Microsoft Silverlight)
URL: http://www.visifire.com/
Galeria: http://www.visifire.com/silverlight_charts_gallery.php
Licencia: http://www.visifire.com/license.php (Tiene licencia dual, tanto Open Source GPL 3.0 o Comercial)
Aqui podemos tener acceso a multiples add-ins que son controles para Silverlight
URL: http://www.codeplex.com/Silverlight/
Charting: http://www.codeplex.com/Silverlight/Wiki/View.aspx?title=Silverlight%20Toolkit%20Overview%20Part%202&referringTitle=Home
-
Silverlight 2.0 Pie Chart
URL: http://petermcg.wordpress.com/2008/05/18/silverlight-20-pie-chart/
Aqui podemos visualizar un ejemplo de lo que podemos hacer con este libreria que es un plugin de jQuery, la empresa que nos brinda Filament Group
http://www.filamentgroup.com/lab/creating_accessible_charts_using_canvas_and_jquery/
Alli tambien hay un ejemplo para la descarga
Recien por la version 0.1, aqui el ejemplo:
http://www.reach1to1.com/sandbox/jquery/jqchart/
Generar pequeños graficos inline ya sea por incrustación HTML o medinate JS (Sparkline en wikipedia: Es un tipo de informacion grafica que repredenta una simple y condensada manera de visualizar variaciones y comparaciones)
URL: http://omnipotent.net/jquery.sparkline/
Ejemplos:
- Mouse speed
- Inline
line graphs
- Bar charts
negative values:
- Composite inline
- Inline with normal range
- Composite bar
- Discrete
Discrete with threshold
- Customize size and colours
- Tristate charts
(think games won, lost or drawn) - Tristate chart using a colour map:
- Pie charts


- Bullet charts
Sencillo para utilizar, lo interesante es la interactividad con el grafico y el zoom
URL: http://code.google.com/p/flot/
Ejemplos: http://people.iola.dk/olau/flot/examples/
Muychas propiedades “altamente deseables”: Plugin Free: 100% Pure JavaScript Charting Solution
Interactivo: Hints, Mouse Tracking, Mouse Events, Key Tracking and Events, Zooming, Scrolling, y Crosshairs
Axis Scaling, Auto Zooming, Scrolling, Stackable Series, Multiple Chart Types, Ajax-Driven Data, Customizable
URL: http://www.ejschart.com/
Ejemplos: http://www.ejschart.com/examples/index.php
Licencia: es Free (con algunas restricciones) para uso Personal en un solo sitio
http://www.ejschart.com/pricing.php
-
PlotKit - Javascript Chart
Framework Javascript para armar gráficos y presentarlos a través de HTML Canvas y SVG vía Adobe SVG Viewer
URL: http://www.liquidx.net/plotkit/
Tutorial: http://media.liquidx.net/js/plotkit-doc/PlotKit.QuickStart.html
Basado en Prototype… simple
URL: http://dragan.yourtree.org/code/ajax-mgraph
Un Articulo: http://dragan.yourtree.org/blog/en/2007/03/31/ajax-mgraph/
Interesante metodo de VML en IE o utiliza Canvas o SVG en cualquier otro browser. También tiene una forma de salida a Javascript
URL: http://webfx.eae.net/dhtml/chart/chart.html
Demo: http://webfx.eae.net/dhtml/chart/demo.html
-
Dynamic Pie Chart with CSS
Con imagenes de fondo y CSS…
la idea:
<div class="pie size35"></div>
<p class="percent">37%</p>
</div>
-
SAC Simple Accessible Charts
CSS.. es decir Accesible, Rapido, no quiere javascript (version basica), Redimensionable, facil extension…
URL: http://www.grassegger.at/xperiment/sac-simple-accessible-charts-css/
Ejemplo: http://grassegger.at/xperimente/charts-daten-semantik-css/
URL: http://applestooranges.com/blog/post/css-for-bar-graphs/?id=55
URL: http://www.cssplay.co.uk/menu/barchart.html
Tener graficos rapidamente sin tener compoenentes extraños :), solamente referenciando una URL para obtener la imagen que genera Google por nosotros.
Mediante la URL formateamos los datos que necesita y listo! a utilizarlo
http://code.google.com/apis/chart/
Un articulo anterior Gráficos a la carta: Google Chart API
Componente .NET:
Aqui hay que escribir un poco de javascript (o encapsularlo en algun componente que lo haga por nosotros) para que Google nos renderice a SVG o VML, y en otros casos en una imagen
Existen tambien algunos graficos que renderizan a Flash.
Interesante es el tipo de consultas que podemos hacer tanto en queryString como en variables en JS ya que todo lo guarda en un Datatable, podemos hacer una consulta a una fuente de datos que se guarde en este objeto (no tiene nada que ver con del DataTable de .NET)
La galeria tiene los graficos tipicos: Area, Lineas, Tortas, Barras, pero tambien se pueden generar Word Cloud, Motion Chart, Panorama Analytics Gadget, Timeline Gadget, Time Series Chart, Gauge, Gantt
-
Yahoo! UI Library: Charts
Aqui la idea mediante sencillos js poder crear graficos en Flash
Todavia esta etapa experimental pero es bueno tenerla en mente
URL: http://developer.yahoo.com/yui/charts/
Ejemplo: http://developer.yahoo.com/yui/examples/charts/index.html
[solo para Flash]
Aqui podemos destacar que podemos tener tambien ayuda si estamos desarrollando dentro de Flash ya que nos brindan una seria de componentes (para Flash y para Flex) llamado ASTRA (ActionScript Toolkit for Rich Applications) donde tenemos algo especial para graficos
http://developer.yahoo.com/flash/astra-flash/charts/
MANUALMENTE ("artesanalmente")
Manualmente, como siempre digo... "artesanalmente". Lo mas free de todos (hacerlo con nuestros propios dedos) con GDI+ dentro de System.Drawing
Ejemplos:
COMERCIALES
Comparte este post: