Para aclarar un poco la pregunta: Código Protovis está escrito utilizando una etiqueta especial,
<script type="text/javascript+protovis">
después de la biblioteca Protovis se ha incluido. Sin embargo, este código debe con texto HTML. El navegador no reconoce el tipo text/javascript+protovis
, por lo que simplemente ignora la etiqueta; Protovis lo encuentra y lo lee en el texto que contiene la etiqueta, sin intentar cargar ningún archivo vinculado por src
.
¿Por qué Protovis hace esto? Porque ejecuta un analizador basado en expresiones regulares a través del código para convertir código JavaScript 1.8 a código JavaScript 1.6; De esta manera, puede usar características de JavaScript de vanguardia, y su código aún se ejecutará en navegadores más antiguos. Muy genial.
Si bien podría escribir código CoffeeScript, compilarlo y luego pegarlo, eso generaría un proceso de construcción muy tedioso. La buena noticia es que es poco probable (¿imposible?) Que obtenga el código del compilador CoffeeScript que utiliza algo más que las características de JS 1.6; la mayoría de esas características están cocidas, de alguna forma, en CoffeeScript. Por ejemplo, comprensiones de matriz y una sintaxis abreviada para funciones anónimas. Eso significa que usted puede sólo tiene que utilizar
<script type="text/javascript" src="myProtovisCode.js"></script>
para su código compilado CoffeeScript (o text/coffeescript
con la biblioteca coffee-script.js
, para el desarrollo).
El verdadero truco está en traducir los ejemplos de Protovis, con su desconocida sintaxis JS 1.8, a CoffeeScript. Por ejemplo,
cell.add(pv.Dot)
.def("x", function(k0, k1) pv.Scale.linear(flowers, function(d) d[k0]).range(0, s))
.def("y", function(k0, k1) pv.Scale.linear(flowers, function(d) d[k1]).range(0, s))
utiliza la sintaxis función anónima abreviado JS 1.8, donde function(x) x * x
es la abreviatura de function(x) { return x * x; }
.Por supuesto, esto se traduce fácilmente a CoffeeScript:
cell.add(pv.Dot)
.def("x", (k0, k1) -> pv.Scale.linear(flowers, (d) -> d[k0]).range(0, s))
.def("y", (k0, k1) -> pv.Scale.linear(flowers, (d) -> d[k1]).range(0, s))
Para mayor referencia, echa un vistazo a New in JavaScript 1.8 encima en documentos de Mozilla (Firefox es el único navegador que soporta de forma nativa JS 1.8 en la actualidad).
Pregunta editada: me gustaría evitar un paso de compilación manual, si es posible ... – nicolaskruchten
Puede usar Sinatra o algo similar para representar la página y convertir coffeescript a javascript sobre la marcha. –