2012-04-26 54 views
8

Tôi đang viết ứng dụng phía máy khách. Tôi muốn sử dụng ClojureScript. Tôi muốn tạo ra đồ họa vector (đồ họa, biểu đồ, đồ thị đường).Clojurescript, JavaScript, SVG, Biểu đồ, Đồ họa

Tôi nên đọc thông tin gì?

[Chỉ có một yêu cầu khó khăn là ClojureScript - (1) Tôi thích Clojure, và muốn làm toàn bộ ứng dụng này trong Clojure (2) điều này cần phải chạy trong trình duyệt]

Cảm ơn!

Trả lời

12

Plug Shameless: Bạn có thể sử dụng C2, thư viện trực quan dữ liệu Clojure/ClojureScript. (Github here.) Ý tưởng cốt lõi giống với D3 --- ánh xạ dữ liệu đến các phần tử DOM --- nhưng vì bạn có các ngữ nghĩa và cấu trúc dữ liệu mạnh mẽ hơn của Clojure, nó kết hợp hơn nhiều so với D3/JavaScript.

Các tài liệu có thể sử dụng một số tình yêu, nhưng nếu bạn đang làm cho bảng xếp hạng truyền thống trong SVG hãy nhìn vào trục và đánh dấu thế hệ những người giúp đỡ:

https://github.com/lynaghk/c2/blob/master/src/cljx/c2/svg.cljx

https://github.com/lynaghk/c2/blob/master/src/cljx/c2/ticks.cljx

Trong khi có isn chưa có bản phát hành chính thức 0.1.0, chúng tôi đã sử dụng nó tại Keming Labs trên một số dự án web và iOS lớn.

Nếu bạn có một hình ảnh cụ thể mà bạn không chắc chắn cách tiếp cận, vui lòng ping me @lynaghk hoặc mở một vấn đề Github.

+0

Điều này thật tuyệt vời! –

+0

Phòng thí nghiệm Keming nằm ở đâu? Ở vùng Vịnh San Francisco, có cơ hội nào không? –

+0

Chúng tôi đang ở Portland, Oregon đầy nắng, mặc dù tôi xuống vịnh một hoặc hai tháng. –

3

Vì thư viện javascript thông thường có thể được sử dụng trong clojurescript, tôi đoán bạn có thể sử dụng một cái gì đó như Raphael hoặc d3 để xử lý svg. d3 có lẽ phù hợp hơn với những gì bạn cần, mặc dù hơi khó sử dụng hơn.

Luôn có thay thế làm việc trực tiếp với DOM, bạn không cần bất kỳ hướng dẫn nào cho điều đó. SVG standard được cấu trúc khá tốt và dễ hiểu.

1

Đây là câu hỏi cũ, nhưng đối với bất kỳ ai tìm thấy câu hỏi này, một tùy chọn khác là sử dụng strokes library, không có sẵn khi câu hỏi được hỏi. Strokes là một trình bao bọc Clojure xung quanh d3.js.