Este documento presenta una introducción a las herramientas de visualización Javascript/Java/Flash como Google Visualization API, Protovis y Prefuse. Explica las ventajas de Javascript para la visualización y proporciona ejemplos del uso de Google Visualization API y Protovis para visualizar datos sobre menciones en medios durante la Copa Mundial de Fútbol de 2010.
Presentación dirigida al alumnado de 2º de Bachillerato de la Comunidad Autónoma de Aragón. Contiene una selección de hechos sobre la dictadura del general Francisco Franco Bahamonde.
Presentación dirigida al alumnado de 2º de Bachillerato de la Comunidad Autónoma de Aragón. Contiene una selección de hechos sobre la dictadura del general Francisco Franco Bahamonde.
This PFG was made by Cristian Álvarez Belaustegui and directed by Jose Emilio Labra Gayo inside the WESO Research Group.
The lecture happened the July 23rd at the School of Computer Science (University of Oviedo).
The project consists in the creation of the backend for the new LandPortal, property of the International Fund for Agricultural Development (IFAD - ONU).
Cómo construir una plataforma poderosa de datos en un ambiente con recursos r...Software Guru
Tener una plataforma interna para analítica de datos brinda una forma poderosa de monitorear tus datos en tiempo real y entender el impacto que tiene tu organización.
Presentado por Ángel Alvarado en SG Virtual Conference 2020
Copyright (c) 2013 Leonardo J. Caballero G.
Permission is granted to copy, distribute and/or modify this document under the terms of the GNU Free Documentation License, Version 1.2 or any later version published by the Free Software Foundation; with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts. A copy of the license is included in the section entitled “GNU Free Documentation License”.
Ponencia de "Remodelación del sitio Web de Canaima", la cual es una ponencia promocional de la experiencia en el desarrollo de la plataforma web. El desarrollo Web es un reto complejo hoy en día. Construir un numero de funcionalidades resulta en un incremento de especificaciones del cliente las cuales hace el diseño de proyecto más difícil. Usando las herramientas adecuadas para los requerimientos del cliente es esencial. En esta charla pretendo presentar una historia en desarrollo sobre lo que acontece en la plataforma Web de Canaima GNU/Linux usando el poder de Python usando Django, Plone y aplicaciones Web en PHP. Básicamente en este caso yo deseo resaltar las principales razones para usar Plone solamente como un CMS para la gestión de contenidos de noticias, elementos multimedia y el uso de Django como una aplicación Mashup que integra diversas recursos disponible en el proyecto Canaima para hacer un estudio del comportamiento social y las contribuciones realizadas al proyecto.
Licencia: Licencia de documentación libre de GNU - GFDL.
Formato: LibreOffice.org Impress y Writer.
Duración: Mínimo 45 minutos, Máximo 1 hora, más 15 minutos de preguntas.
Dictada en: IX CNSL Cojedes, IX CNSL Tachira.
Ultima actualización: 06/06/2013.
Lugar: San Crsitobal, Estado Tachira, Venezuela.
Autor: T.S.U. Esp. Leonardo J. Caballero G.
Correo electrónico: leonardoc at plone dot org, leonardocaballero at gmail dot com.
Domicilio Web: http://about.me/macagua
Visualizar y descarga vía: http://www.slideshare.net/lcaballero / https://speakerdeck.com/macagua/
Charla Sobre prototipado en la universidad de los Andes 2014 - 03 - 27Elkin Garavito Beltran
Esta presentación hace un resumen de distintos métodos de prototipado , y como pueden ser utilizado para ejercicios de creación de producto . Se presentan tres casos uno a nivel de software y 2 a nivel de servicios
This PFG was made by Cristian Álvarez Belaustegui and directed by Jose Emilio Labra Gayo inside the WESO Research Group.
The lecture happened the July 23rd at the School of Computer Science (University of Oviedo).
The project consists in the creation of the backend for the new LandPortal, property of the International Fund for Agricultural Development (IFAD - ONU).
Cómo construir una plataforma poderosa de datos en un ambiente con recursos r...Software Guru
Tener una plataforma interna para analítica de datos brinda una forma poderosa de monitorear tus datos en tiempo real y entender el impacto que tiene tu organización.
Presentado por Ángel Alvarado en SG Virtual Conference 2020
Copyright (c) 2013 Leonardo J. Caballero G.
Permission is granted to copy, distribute and/or modify this document under the terms of the GNU Free Documentation License, Version 1.2 or any later version published by the Free Software Foundation; with no Invariant Sections, no Front-Cover Texts, and no Back-Cover Texts. A copy of the license is included in the section entitled “GNU Free Documentation License”.
Ponencia de "Remodelación del sitio Web de Canaima", la cual es una ponencia promocional de la experiencia en el desarrollo de la plataforma web. El desarrollo Web es un reto complejo hoy en día. Construir un numero de funcionalidades resulta en un incremento de especificaciones del cliente las cuales hace el diseño de proyecto más difícil. Usando las herramientas adecuadas para los requerimientos del cliente es esencial. En esta charla pretendo presentar una historia en desarrollo sobre lo que acontece en la plataforma Web de Canaima GNU/Linux usando el poder de Python usando Django, Plone y aplicaciones Web en PHP. Básicamente en este caso yo deseo resaltar las principales razones para usar Plone solamente como un CMS para la gestión de contenidos de noticias, elementos multimedia y el uso de Django como una aplicación Mashup que integra diversas recursos disponible en el proyecto Canaima para hacer un estudio del comportamiento social y las contribuciones realizadas al proyecto.
Licencia: Licencia de documentación libre de GNU - GFDL.
Formato: LibreOffice.org Impress y Writer.
Duración: Mínimo 45 minutos, Máximo 1 hora, más 15 minutos de preguntas.
Dictada en: IX CNSL Cojedes, IX CNSL Tachira.
Ultima actualización: 06/06/2013.
Lugar: San Crsitobal, Estado Tachira, Venezuela.
Autor: T.S.U. Esp. Leonardo J. Caballero G.
Correo electrónico: leonardoc at plone dot org, leonardocaballero at gmail dot com.
Domicilio Web: http://about.me/macagua
Visualizar y descarga vía: http://www.slideshare.net/lcaballero / https://speakerdeck.com/macagua/
Charla Sobre prototipado en la universidad de los Andes 2014 - 03 - 27Elkin Garavito Beltran
Esta presentación hace un resumen de distintos métodos de prototipado , y como pueden ser utilizado para ejercicios de creación de producto . Se presentan tres casos uno a nivel de software y 2 a nivel de servicios
(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informáticavazquezgarciajesusma
En este proyecto de investigación nos adentraremos en el fascinante mundo de la intersección entre el arte y los medios de comunicación en el campo de la informática.
La rápida evolución de la tecnología ha llevado a una fusión cada vez más estrecha entre el arte y los medios digitales, generando nuevas formas de expresión y comunicación.
Continuando con el desarrollo de nuestro proyecto haremos uso del método inductivo porque organizamos nuestra investigación a la particular a lo general. El diseño metodológico del trabajo es no experimental y transversal ya que no existe manipulación deliberada de las variables ni de la situación, si no que se observa los fundamental y como se dan en su contestó natural para después analizarlos.
El diseño es transversal porque los datos se recolectan en un solo momento y su propósito es describir variables y analizar su interrelación, solo se desea saber la incidencia y el valor de uno o más variables, el diseño será descriptivo porque se requiere establecer relación entre dos o más de estás.
Mediante una encuesta recopilamos la información de este proyecto los alumnos tengan conocimiento de la evolución del arte y los medios de comunicación en la información y su importancia para la institución.
Es un diagrama para La asistencia técnica o apoyo técnico es brindada por las compañías para que sus clientes puedan hacer uso de sus productos o servicios de la manera en que fueron puestos a la venta.
(PROYECTO) Límites entre el Arte, los Medios de Comunicación y la Informáticavazquezgarciajesusma
En este proyecto de investigación nos adentraremos en el fascinante mundo de la intersección entre el arte y los medios de comunicación en el campo de la informática.
La rápida evolución de la tecnología ha llevado a una fusión cada vez más estrecha entre el arte y los medios digitales, generando nuevas formas de expresión y comunicación.
Continuando con el desarrollo de nuestro proyecto haremos uso del método inductivo porque organizamos nuestra investigación a la particular a lo general. El diseño metodológico del trabajo es no experimental y transversal ya que no existe manipulación deliberada de las variables ni de la situación, si no que se observa los fundamental y como se dan en su contestó natural para después analizarlos.
El diseño es transversal porque los datos se recolectan en un solo momento y su propósito es describir variables y analizar su interrelación, solo se desea saber la incidencia y el valor de uno o más variables, el diseño será descriptivo porque se requiere establecer relación entre dos o más de estás.
Mediante una encuesta recopilamos la información de este proyecto los alumnos tengan conocimiento de la evolución del arte y los medios de comunicación en la información y su importancia para la institución.
Actualmente, y debido al desarrollo tecnológico de campos como la informática y la electrónica, la mayoría de las bases de datos están en formato digital, siendo este un componente electrónico, por tanto se ha desarrollado y se ofrece un amplio rango de soluciones al problema del almacenamiento de datos.
Inteligencia Artificial y Ciberseguridad.pdfEmilio Casbas
Recopilación de los puntos más interesantes de diversas presentaciones, desde los visionarios conceptos de Alan Turing, pasando por la paradoja de Hans Moravec y la descripcion de Singularidad de Max Tegmark, hasta los innovadores avances de ChatGPT, y de cómo la IA está transformando la seguridad digital y protegiendo nuestras vidas.
3Redu: Responsabilidad, Resiliencia y Respetocdraco
¡Hola! Somos 3Redu, conformados por Juan Camilo y Cristian. Entendemos las dificultades que enfrentan muchos estudiantes al tratar de comprender conceptos matemáticos. Nuestro objetivo es brindar una solución inclusiva y accesible para todos.
1. Un paseo por la Visualización en siete
días
JAVASCRIPT/ JAVA/ FLASH
Ana Belén García Parra 1
2. Día 4
Un paseo por la Visualización en 7 días
I N D I C E
Visualización Redes Java / javascript Flash
Google API
Protovis
Prefuse
Ana Belén García Parra 2
3. ¿Por qué Javascript?
• Desarrollo rápido
• Pequeña curva de aprendizaje
• Integración directa en páginas Web
• Diversas librerías de visualización
• Gran número de ejemplos
3Ana Belén García Parra
5. GVA. Visión general
• Acceso a fuentes de datos externas
• En continuo desarrollo
• Gran selección de
visualizaciones
• Reutilización
• Visualizaciones atractivas
• Visualizaciones integrables
en forma de Gadget
Ana Belén García Parra 5
7. GVA. Uso: APIs y Librerías 1/3
Google AJAX API
Third-party
visulization
Visualization API
Visualization
library
Ana Belén García Parra 7
8. GVA. Uso: Preparar los datos 2/3
• DataTable: todas visualizaciones esperan
este tipo de datos
– DataView: versión de sólo lectura
• Reordenar /ocultar/hacer cálculos sobre filas y
columnas
• Poblado a mano
• Poblado a partir de un proveedor: DataSource
– Ej. Google SpreadSheet
Ana Belén García Parra 8
9. GVA. Uso: Dibujar la visualización 3/3
• Crear la instancia de la visualización
– ¿Dónde se dibujará?
• Dibujar
– ¿Cómo se personaliza?
Ana Belén García Parra 9
10. GVA. Crear una visualización
• GWT (Google Web Toolkit). Desarrollo en java y
traducción a Javascript
• Javascript
– Evitar conflictos de nombres
– Evitar conflictos CSS
– Implementar :
• Un constructor. Parámetro: objeto DOM contendor
• Un método draw. Parámetros: un DataTable y un map con
opciones de visualización (opcional)
– Añadir los eventos con
google.visualization.events.trigger
Ana Belén García Parra 10
11. GVA. Ejemplos: Motion Chart 1/3
• DataSet: Turkey2010_day_list-main_countries_day_list
– País | Fecha | Menciones
• ¿Qué recibe MotionChart?
– String | Fecha | Número o String |…
• ¿Qué buscamos?
– Comparación de menciones frente a puntos anotados en el
tiempo
• ¿Qué utilizamos?
– Consulta de datos a proveedor externo
– Creación inline de DataTables
– Combinación de DataTables
Ana Belén García Parra 11
12. GVA. Ejemplos: Annotated Time Line 2/3
• DataSet: Turkey2010_hour_count-country_hour_count
– Fecha | Hora | País1 | País2 | …
• ¿Qué recibe Annotated Time Line?
– Fecha o Fecha y hora | Número | [String | String ] |…
• ¿Qué buscamos?
– Comparación de menciones entre países y cuándo se
habla de ellos
• ¿Qué utilizamos?
– Consulta de datos a proveedor externo
– Uso de Formatters
– Transformación de DataTables
Ana Belén García Parra 12
13. GVA. Ejemplos: Treemap 3/3
• DataSet: Turkey2010_players-players_pais
– País| # | Jugador | Nick | menciones | % | edad |
altura|Posición | Equipo,liga local |…
• ¿Qué recibe Treemap?
– Nodo | Padre | Valor tamaño | [Valor color] |…
• ¿Qué buscamos?
– Comparación de número de menciones por diversos
criterios
• ¿Qué utilizamos?
– Consulta de datos a proveedor externo
– DataView: ocultar cols, cols calculadas
– Creación inline de DataTables
Ana Belén García Parra 13
17. Protovis. Visión general 2/2
• Liderado por Mike Bostock y Jeff Heer
del Stanford Visualization Group con
importante colaboración de Vadim
Ogievetsky.
• Licencia BSD
• Versión actual: Protovis 3.2
• Javascript y SVG. Sin necesidad de
plugins.
Ana Belén García Parra 17
18. Protovis. Conceptos
• Sintaxis declarativa
• Encadenamiento de propiedades
• Herencia de propiedades
• Flujo dirigido por los datos
Ana Belén García Parra 18
23. • Descargar Protovis
http://protovis-js.googlecode.com/files/protovis-3.2.zip
• Crear un fichero HTML
• Declarar el script para la visualización
• Implementar el código de la visualización
apoyado en el API de Protovis
– Estructuras de datos
– Transformación de escalas
– Paletas de colores
– …
Tu visualización
Protovis. Cómo 2/6
Ana Belén García Parra 23
24. Protovis. Cómo 3/6
Comparando con una librería de más alto nivel…
Year Austria Belgium Czech Rep.
2003
2004
2005
…
Ana Belén García Parra 24
28. Protovis. Layout 1/2
• Encapsula un diseño o técnica de
visualización para facilitar su reutilización
– Realizar visualizaciones complejas con bajo coste
• Treemap, Grid, Network…
– Extender visualizaciones para una mayor adopción
• Especialización de Panel
• Define un conjunto de prototipos de marca como
propiedades
• Exportan marcas para que sean extendidas en la
reutilización
Ana Belén García Parra 28
31. Día 4 Visualizar
Muchas gracias por vuestra atención
Ana Belén García Parra
Contacto: anabelengp@gmail.com
Ana Belén García Parra 31
Notas del editor
…Javascript: lenguanje de scripting que no necesita ser compiladoPara diseñadores de aplicaciones Web no es necesario conocer otras tecnologías.Integrado en navegadores WebGoogle visualization Api, Protovis, ExtJS, Highcharts,Javascript ampliamente utilizado en la comunidad Web
Ültima versión : agosto 2010
Google Ajax APIGestión de peticiones asíncronasPermite cargar el restoGoogle Visualization APIGestión y manejo de datos y fuentesPintado de visualizacionesLibrerías de visualización
las visualizaciones almacenan sus datos en tablas. Cada dato en una celda. Cada tipo de visualización espera sus datos en un formato. Por ejemplo un piechart espera una tabla con una col tipo string y otra numérica. Una linechart espera dos col numéricas.filas indexadas desde 0columnas indexadas desde 0 o un ID específico.Tipo de los datos de la columna [requerido]: boolean, string, number, dateID [opcional]: alfanuméricoEtiqueta: nombre de la columna. Las visualizaciones pueden usarla como leyenda del ejegoogle.visualization.DataTable es el datatableoriginal.Las celdas contienen los valores y pueden tener asociado un valor "formatted" para que sea mas friendly. P.ej. usar valores formatted "low" "medium", "high" para valores reales 1, 2 y 3.DataTable(). creador. luego se van rellenando los datos con addColumn(type,name), addRow([col1,col2]), addRows([[col1,col2],[..],..])DataTable(data, version). creador de una tabla a la que se le pasan los datos "data".data: puede ser un JSON (DataTable.ToJSON) o un objeto Javascript literal object (http://code.google.com/intl/es-ES/apis/visualization/documentation/reference.html#dataparam) version: versión del wireprotocolused. Ahora es la 0.6Si se cambian los datos después de llamar al draw() hay que volver a llamarlo.google.visualization.DataView es una clase de conveniencia para obtener una vista read-only del datatable donde ocultar o cambiar de orden las columnas o filas de una forma rápida sin modificar los datos. No es una vista estática de la datatable pero algunas modificaciones no se reflejan y hay que tratarlas.DataView(DataTable/DataView). constructor a partir de una tabla o vista.DataView.fromJSON(data, viewAsJSON). constructor a partir de un json (data). ViewAsJSON es lo que se ve cuando DataView.toJSON()
Hace falta indicar eldivEn el draw se establecen los valores de las propiedades customizables.
DataSet. Es un subconjunto de los datos obtenidos sobre las menciones de los paises en cada día. Se tratan los países que llegaron a semifinales y EspañaRecibe String para el nombre de la bola, Fecha para ver evolución en tiempo y varias columnas de int o String . Int para comparar valores y string para colorRelación entre cómo se le da un partido a un equipo y cuánto se habla de él teniendo en cuenta la importancia del partido (+ tiempo + cercano a la final)Vistazo general con colores únicos. Países que tienen puntos pero no se mencionan más. Esta visualización hace interpolación del movimiento entre dos puntos. Por lo tanto, si un día se juega y sale n 80 puntos y a los 2 días se vuelve a jugar y salen 120 no se verá escalón del 80 al 0 y al 120 sino una curva progresiva.De eeuu y españa se habla más que del resto nada más empezar el mundial y eso que españa perdió el partido.Color para gana y no gana.España tiene picos en partidosZoom11/9 y 12/9: Turquia es un caso curioso porque se habl más en la semifinal que en la finalSacar traza de estados unidos: se habla más al final aunque tengan menos puntos. El día que sacó 121 puntos era contra angola y todo el mundo se lo esperaba. El día que más se ha hablado fue un partido reñido contra lituania con poca diferencia de puntos. Pero fue interesante
Quitamos los países que tenían menos de 500 menciones totalesValor, título y descripciónLas horas son GMTEspaña GMT+1Turquía GMT+3Sin zoom:Los picos morados son de cuando jugó españa. Usa tiene más actividad al finalZoom 1d:4 sept-9h. España-Grecia. Se habla de 5 (hablar sobre alineaciones) a 8 y el partido es a las 6. Cuando más se habla es a las 7 (mitad del partido)9Sept- EN el mundial los partidos de cuartos eran cada 3 horas -el partido de EEUU fue a las 3 y se habló de 2 a 5 y punto más alto a las 4 (mitad partido) -el de argentina fue a las 6 y hablaron de 5 a 8 y el punto más alto a las 7El picazo.Se habla mucho de Argentina y España. Coincide con partidos de ambos equipos y se habla también de sus respectivos contrarios (Brasil) pero hay mucha diferencia con el resto. Después hay un vacío con lo que se podría revelar un error en los datos.
Pais-Jugador. color:edadVisualización de mayor fiabilidad porque se contabilizan menciones sobre jugadores y no sólo las de un hashtag. Durante el partido se suele hablar más de jugadores que de equipo.Navegar.Se ha hablado más de Durant que es jugador jóven. Iba de suplente pero debido a bajas ha jugado más y ha resultado ser revelaciónVolver paara atrásRojo –joven. Se habla mucho de ugadores jóvenes (revelación). Mayoría. Contrasta el caso de argentina que (me meto) tiene muchos jugadores todaví del equipo que ganó las olimpiadas 2004 (ObertoScola, delfino..)Entrar en españaSe habla más de jugadores que juegan han jugado o jugarán en la NBAEl que se haya hablado mucho de un país puede ser por: Haya llegado lejos, porque sus jugadores sean muy conocidos o revelación.Pasamos a Liga-Equipo-Jugador color: alturaLa NBA tiene casi el 50% de las menciones debido a que los jugadores más conocidos suelen estar en la nba. La ACB tiene bastante importancia a pesar de que sus principales jugadores estén en la NBA porque en la ACB también juegan jugadores importantes de otros países.Países importantes como Argentina o Brasil no tienen ligas importantesSe habla más de los altos. En la NBA por ejemplo. En europa los jugadores más importantes son más bajitos (quizá por que los altos están en la NBA) por lo que se puede decir que las ligas europeas son menos físicas y más técnicas.
Dentro del espectro de librerías gráficas disponible, podemos encontrar librerías gráficas de bajo nivel que permiten manipular formas y píxeles pero resultan tediosas a la hora de usarlas para visualización y librerías de visualización que facilitan ciertas tareas pero renuncian al control directo de los componentes.El objetivo de Protovis es encontrar el punto medio para proporcionar el control detallado de las librerías de bajo nivel ofreciendo un nivel de abstracción que facilite el diseño de visualizaciones.
Protovis 3.2 de mayo de 2010No necesita plugins porque utiliza tecnologías nativas del navegador.
** Sintaxis declarativa: la visualización se crea añadiendo componentes y declarando las propiedades de forma intuitiva.** Flujo dirigido por los datos: no es necesario iterar por el conjunto de datos, los propios componentes lo realizan de forma transparente, por lo que no es necesario programar bucles.-> Gracias a esto no es necesario tener grandes conocimientos de programación.** Herencia de propiedades: Al añadir un nuevo componente, éste hereda los valores de las propiedades ya declaradas para el componente anterior. P.ej, si se define tamaño o posición para el primero el segundo ya lo hereda.** Encadenamiento de propiedades: las propiedades se especifican en forma de función que devuelve el objeto
Marca:junto con pv.Panel es el core del framework.propiedades: top-right-bottom-left, visible, data, cursor, title.Por cada dato se renderiza una mark. Así salen las charttipos:area: area sólida entre 2 polilineas (unión de los puntos representados por los datos)sólo se define el width o el height. Dependerá de si es horizontal o vertical.properties: position, width, height, interpolate, segmented, fillSyle, strokeStyle, lineWidthvisualización normal: (1variable): bottom: 0, left equidistante, height en f de datausado para: Area Charts,Stacked Charts,Streamgraphsbar:properties: position, width, height, fillStyle, strokeStyle, lineWidthvisualización normal: (1 variable):bottom 0, left equidistante, height en f de data, width constanteusado para : bar charts, grouped bar charts, stacked bar charts and histogramsdot:properties: position (distancia al centro del punto), fillStyle, strokeStyle, lineWeight, size (default = 20), shape ("circle", "square", "triangle", "cross", "diamond")usado para: Scatterplots,Anderson’sFlowers,Bubble Chartsvisualización normal: (2variables) left, bottom
image: añadir una img a un panelproperties: position, width, height, url, title, style (fill, stroke, line)label:propertiesposition,textAlign - horizontal alignment. def = lefttextBaseline - vertical alignment. def=bottomtextMargin - marginto offset fromthetextanchor. def=3textAngle - rotationangle, in radians. def=0 (radianes). Ej (-Math.PI / 2)font -CSS2 font.: def= “10px sans-serif”textStyle - text color. def=blacktext: the default behaviorforthetextpropertysimplydisplaysthe data elementassociatedwiththemarkinstance. line: conjunto de segmenos conectados (polilinea)usado para: line, step chartsvisualizacion normal: (1variable) left equidistante y bottom en f de dataproperties: position, segmented, interpolate, strokeStyle, linewidth, fillstyle si se forma una figura cerrada.Rule:properties:position, width, height, strokeStyle = black, lineWidth=1regla vertical: especificar el left / regla horizontal: especificar el bottomWedge: representa un arco sólido o una barra en coordenadas polarespie o donut chart, polar clockpropiedades: prosition: distancias al centro del arco.startAngle - thestartangle of thewedge in radians.endAngle - theendangle of thewedge in radians.angle - theangle subtended bythewedge in radians.innerRadius - theinnerradius of thewedge. def= 0 para piechartsouterRadius - theouterradius of thewedge.visualizacion normal: leftbotom constantes porque todos los arcos comparten centro, angle en f de data (d *2*PI).Si solo se especifica el ángulo los arcos se dibujan pegados.los valores tienen que ser de 0 a 1. Usar
Unlike normal marks, when you add a mark to a panel, that mark does not inherit the properties of the panel. However, the position of the mark will be offset by the panel’s margins.
<script type="text/javascript+protovis"> use expression closures in browsers other than Firefoxexpression closure (Firefox 3+): [5,1,3,2,4].sort( function(a,b) b > a );
Componente abstracto completo en el que sólo se personalizan algunas propiedades
En este caso cada fila o octo de datos representa los valores de el cto de barras definido por un color50 = 15*3 + 5px
Funciona como contenedor, no hace falta añadirlo a un panelLos prototipos de marca definen la implementación del layoutAlgunos prototipos de marca se exportan, como el node en Treemap y el cell en Grid. Esta marca es un prototipo y hay que añadirle una marca concreta (bar, dot) pudiendo obtener distintas visualizaciones añadiendo distintas marcas.
Streamgraph:stacked chart en el que se cambia la linea base desde donde se empiezan a apilar las capas.Offset: wiggle. Es un algoritmo para streamgraph que minimiza el cambio en la pendiente ponderada por el espesor de la capa