5

Protovis を使用してビジュアライゼーションを作成したいのですが、JavaScript ではなく CoffeeScript で記述します (一部は(x)->x関数表記ですが、他の理由もあります) 。

これは可能ですか？どの<script>タグを使用しますか? また、必要なスクリプト タグの特別な順序はありますか?

ありがとう。

編集:可能であれば、手動のコンパイル手順を避けたいです。

4

3 に答える 3

7

質問を少し明確にするために: Protovis コードは特別なタグを使用して記述されています。

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

Protovis ライブラリが含まれた後。ただし、このコードは HTML でインライン化する必要があります。ブラウザは型を認識しないtext/javascript+protovisため、単にタグを無視します。Protovis はそれを見つけて、タグに含まれるテキストを読み取りますsrc。

なぜプロトビスはこれを行うのですか? コードを通じて正規表現ベースのパーサーを実行して、JavaScript 1.8 コードを JavaScript 1.6 コードに変換するためです。そうすれば、最先端の JavaScript 機能を使用でき、コードは古いブラウザでも実行できます。とてもかっこいい。

もちろん、CoffeeScript コードを記述してコンパイルし、貼り付けることもできますが、これは非常に面倒なビルド プロセスになります。幸いなことに、JS 1.6 機能以外のものを使用するコードを CoffeeScript コンパイラから取得する可能性はほとんどありません (不可能ですか?)。これらの機能のほとんどは、何らかの形で CoffeeScript 自体に組み込まれています。たとえば、配列内包表記や無名関数の省略構文などです。つまり、あなたはただ使うことができます

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

コンパイルされた CoffeeScript コード用 (または開発用text/coffeescriptのcoffee-script.jsライブラリ用)。

本当の秘訣は、なじみのない JS 1.8 構文を使用した Protovis の例を 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 のドキュメントでNew in JavaScript 1.8を確認してください (現在、JS 1.8 をネイティブにサポートしているブラウザは Firefox だけです)。

于 2011-02-08T16:05:24.863 に答える
2

開発目的でのみ CoffeeScript で記述し、プレーンな JS にコンパイルして に含めることをお勧めします<script>。

-c次のフラグを使用してコンパイルします。

coffee -c someFile.coffee

出力はsomeFile.js同じディレクトリにあります。

于 2011-02-08T13:57:45.247 に答える
1

OK、これで少し遊んでみましたが、実際には、<script type="text/coffeescript">オプションでsrc="x.coffee"属性を持つことができるタグを使用して、Coffeescript で Protovis を使用できます。外部コンパイルは必要ありません。明らかに、これにはページが読み込まれるたびにブラウザがCoffeescriptをJavascriptにコンパイルする必要がありますが、迅速な視覚化タスクにはそれが機能します.

于 2011-02-08T15:59:00.660 に答える