5

Я хотел бы создать визуализацию с помощью Protovis, но писать в CoffeeScript, а не JavaScript (частично для (x)->x функции записи, но по другим причинам, а)Можно написать код Protovis в CoffeeScript?

Возможно ли это? Какой тег <script> я бы использовал и есть ли какой-либо специальный порядок тегов скрипта, который вам нужен?

Спасибо.

Редактировать: Я бы хотел, если это возможно, избегать ручной компиляции.

ответ

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)) 

Для получения дополнительной справки, проверить New in JavaScript 1.8 более в документации Mozilla, (Firefox является единственным браузером, который изначально поддерживает JS 1,8 в настоящее время).

2

Лучше писать в CoffeeScript только для целей разработки, а затем скомпилировать в простой JS для включения в <script>.

Compile используя -c флаг:

coffee -c someFile.coffee 

Выход будет находиться в том же каталоге someFile.js.

+0

Редактированный вопрос: Я бы хотел избежать ручного этапа компиляции, если возможно ... – nicolaskruchten

+0

Вы можете использовать Sinatra или что-то подобное, чтобы сделать страницу и преобразовать coffeescript в javascript на лету. –

1

OK Я немного поиграл с этим, и на самом деле я могу использовать Protovis с Coffeescript, используя тег <script type="text/coffeescript">, который может иметь необязательный атрибут src="x.coffee". Внешней компиляции не требуется. Очевидно, это требует, чтобы браузер собирал Coffeescript в Javascript каждый раз, когда загружается страница, но для задач быстрой визуализации он работает для меня.

+0

См. Мой ответ на simul для дальнейшего объяснения. Обратите внимание, что скрипты 'text/coffeescript' запускаются после всех других скриптов, независимо от того, где вы помещаете теги, потому что они загружаются через Ajax из' coffee-script.js'. –

Смежные вопросы