可以在CoffeeScript中编写Protovis代码吗?

nic*_*ten 5 javascript visualization data-visualization protovis coffeescript

我想用Protovis创建可视化,但用CoffeeScript而不是JavaScript编写(部分用于(x)->x函数表示法,但也有其他原因)

这可能吗?我<script>会使用什么标签,是否有必要的脚本标签的特殊顺序?

谢谢.

编辑:如果可能的话,我想避免手动编译步骤.

Tre*_*ham 7

为了澄清一点问题:使用特殊标签编写Protovis代码,

<script type="text/javascript+protovis">
Run Code Online (Sandbox Code Playgroud)

继Protovis图书馆之后.但是,必须使用HTML内联此代码.浏览器无法识别text/javascript+protovis类型,因此它只是忽略标记; Protovis找到它并读入标签包含的文本,而不尝试加载任何链接的文件src.

为什么Protovis会这样做?因为它通过代码运行基于正则表达式的解析器,将JavaScript 1.8代码转换为JavaScript 1.6代码; 这样,您可以使用尖端的JavaScript功能,您的代码仍然可以在旧版浏览器中运行.很酷.

虽然您当然可以编写CoffeeScript代码,编译它,然后将其粘贴,这将构成一个非常繁琐的构建过程.好消息是,你不可能(不可能?)你将从使用JS 1.6功能之外的任何东西的CoffeeScript编译器中获取代码; 大多数这些功能都以某种形式出现在CoffeeScript本身中.例如,数组理解,以及匿名函数的缩写语法.这意味着你可以使用

<script type="text/javascript" src="myProtovisCode.js"></script>
Run Code Online (Sandbox Code Playgroud)

用于编译的CoffeeScript代码(或text/coffeescript用于coffee-script.js库,用于开发).

真正的诀窍是将Protovis示例及其不熟悉的JS 1.8语法转换为CoffeeScript.例如,

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))
Run Code Online (Sandbox Code Playgroud)

使用缩写的JS 1.8匿名函数语法,其中function(x) x * x简写为function(x) { return x * x; }.当然,这很容易转换为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))
Run Code Online (Sandbox Code Playgroud)

有关进一步的参考,请查看Mozilla文档中的JavaScript 1.8中的新功能(Firefox是目前唯一本身支持JS 1.8的浏览器).