5

我想使用 Protovis 创建可视化，但用 CoffeeScript 而不是 JavaScript 编写（部分原因是(x)->x函数符号，但也有其他原因）

这可能吗？我将使用什么<script>标签，是否有任何特殊的脚本标签顺序是必需的？

谢谢。

编辑：如果可能的话，我想避免手动编译步骤。

4

3 回答 3

7

稍微澄清一下问题：Protovis 代码是使用特殊标签编写的，

<script type="text/javascript+protovis">

在包含 Protovis 库之后。但是，此代码必须与 HTML 内联。浏览器无法识别text/javascript+protovis类型，因此它只是忽略了标签；Protovis 找到它并读取标签包含的文本，而不尝试加载任何由src.

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

虽然您当然可以编写 CoffeeScript 代码，对其进行编译，然后将其粘贴进去，但这会导致构建过程非常繁琐。好消息是，您不太可能（不可能？）从 CoffeeScript 编译器中获得使用 JS 1.6 功能以外的任何功能的代码。大多数这些功能都以某种形式融入到 CoffeeScript 本身中。例如，数组推导和匿名函数的缩写语法。这意味着你可以使用

<script type="text/javascript" src="myProtovisCode.js"></script>

用于您编译的 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))

使用缩写的 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))

如需进一步参考，请在 Mozilla 的文档中查看JavaScript 1.8 中的新功能（Firefox 是目前唯一原生支持 JS 1.8 的浏览器）。

于 2011-02-08T16:05:24.863 回答
2

最好仅出于开发目的使用 CoffeeScript 编写，然后编译为纯 JS 以包含在<script>.

-c使用标志编译：

coffee -c someFile.coffee

输出将someFile.js在同一目录中。

于 2011-02-08T13:57:45.247 回答
1

好的，我已经玩了一点，实际上我可以使用带有 Coffeescript 的 Protovis，使用<script type="text/coffeescript">标签，该标签可以选择具有src="x.coffee"属性。无需外部编译。显然，这需要浏览器在每次页面加载时将 Coffeescript 编译为 Javascript，但对于快速可视化任务，它对我有用。

于 2011-02-08T15:59:00.660 回答