Crear gráficas accesibles con jQuery y canvas

ByLuis

Buen plugin para jQuery que permite crear gráficas de datos accesibles mediante canvas. El script es bastante fácil de usar, se crea una tabla (sí, si, con <table>, que es para lo que se deben usar), y el script dibuja los datos en un canvas.
Ofrece la posibilidad de crear gráficas de pie, barras y líneas, para lo cual, en el class de la etiqueta canvas hay que especificar el origen y el tipo de gráfica (por ejemplo, fgCharting_src-dataTable_type-pie).
Creating accessible charts using canvas and jQuery
Vía / couch

Similar Posts

Drag & Drop de ficheros en Firefox

ByLuis

Esto puede dar mucho juego, pero tan solo funciona en Firefox 3.6+, por lo que no podemos depender de este script en nuestras aplicaciones. A partir de la versión 3.6, Firefox permite realizar drag&drop de ficheros en nuestra web y mediante Javascript poder obtener los ficheros o textos que se arrastren contra un elemento específico.

Su uso es muy sencillo:

dropzone.addEventListener("drop", function(event) {
  event.preventDefault();
  // Ready to do something with the dropped object
  var allTheFiles = event.dataTransfer.files;
  alert("You've just dropped " + allTheFiles.length + " files");
}, true);

Y dispone de una API tanto para el drag&drop como para los ficheros.

Recomiendo ver el código fuente de este ejemplo para tener una librería que te hace todo el trabajo.

file drag and drop in Firefox 3.6

TJPzoom: zoom mediante Javascript

ByLuis

Un buen Javascript que permite añadir zoom a nuestras imágenes. El script añade una ventana con marco sombreado a la imagen en la que se ve el zoom, pudiendo moverla por toda la imagen.
jszoom.png
Si hacemos drag hacia arriba el zoom aumenta, hacia abajo disminuye, hacia la derecha la ventana aumenta y hacia la izquierda disminuye. Además permite utilizar otra imágen con mayor resolución para evitar el pixelado.
TJPzoom
Vía / WebAppers

Javascript: getElementsBy

ByLuis

Uno de los problemas con los que nos solemos encontrar cuando programamos en Javascript es el modo en el que obtenemos los elementos HTML que deseamos tratar, a parte del conocido getElementById(), existen otros, algunos estándar y otros desarrollados por otra gente.

Una interesante lista con todos ellos reunidos: getElementById (W3C, Prototype JavaScript framework), getElementsByName (W3C), getElementsByTagName (W3C), getElementsByTagNames (Peter-Paul Koch), getElementsByClassName (Prototype JavaScript framework, Stuart Colville, Robert Nyman, Jonathan Snook), getElementsBySelector (Dean Edwards, Olivier Gambier, Prototype JavaScript framework 1.0.5rc2, Simon Willison, jQuery, Joe Hewitt), getElementsByAttribute (Robert Nyman, David “liorean” Andersson, Jack Sleight) y getElementsByAnything (Matthew Pennell)

getElementsBy*()

Vía / Menéame

Problemas de las librerías Javascript

ByLuis

Ultimamente están apareciendo muchas librerías Javascript que mejoran el trabajo con Javascript, pero no todo son cosas positivas y hay gente que muestra problemas que aparecen con el uso de estas librerías:

  • Escasa documentación: ya sea online u offline, si la librería es increible, pero no hay una forma sencilla de saber cómo usarla, pues nos quedamos como estábamos.
  • Escaso soporte: estas librerías no suelen tener un sistema que ayude a los usuarios con los problemas que se encuentran.
  • Demasiado grandes: cargar una librería que ocupa mucho, para usar un par de funciones, es mucho lo que se carga y poco lo que se usa, quizás repercute negativamente en rendimiento o en ancho de banda.
  • Demasiado específicas: sobre todo al trabajo de otra gente, por lo que a nosotros nos puede venir parcialmente bien.
  • Diferentes en estructura: diferentes a la forma en que lo hacemos nosotros, en vez de usar estructuras estándares a las que podemos estar todos acostumbrados.
  • No hay guías paso a paso: para poder entender las funcionalidades de las liberías con ejemplos.
  • Escasa información sobre soporte a navegadores
  • Inconsistencia en nombres de métodos y variables: en la W3C hay amplia documentación sobre la metodología que se debería seguir para la nomenclatura de funciones y variables.

Más información

Why good JavaScript libraries fail

Dear JavaScript Library Developers…

Too many libraries, not enough librarians

Six things that suck about the Web in 2006

Vía / QuirksBlog

Truwex Online: validador de accesibilidad y calidad

ByLuis

Truwex ofrece una herramienta online para comprobar la accesibilidad y la calidad de un URL dada. Una de las mayores diferencias con otras aplicaciones parecidas es que valida el código HTML generado, no solo el código HTML plano, tiene en cuenta el código generado por el Javascript.
Algo que también me ha llamado mucho la atención es que ofrece la posibilidad de ver los errores detectados en la propia página, incluso cuando se trata de capas ocultas, facilitando así la localización de los errores, y por qué no, entender qué es lo que está mal hecho.
truwex.png
En la misma página nos explican los errores que detecta y cómo solucionarlos.
También es curiosa la aplicación online que comprueba el script de Google Analytics que contiene la página.
Truwex Online
Vía / 456 Barea Street