4

Clojurescript の dom に SVG 要素を追加する最良の方法は何ですか? Twitterbuzz の例では Google Closure lib の Graphics オブジェクトを使用していますが、IE の互換性は気にしませんでした。HTML のように要素を追加する方法はあり(dom/build [:svg [:g [:text "something like this ?"]]]) ますか? SVG 機能。私は Apogee を試しましたが、それは SVG コードをシリアライズするので、DOM を直接操作したいと思います。

4

4 に答える 4

4

dom/build は、名前空間なしで DOM 要素を構築します。dom/build を拡張するか、SVG 用に作成する必要があります。次のコードを使用して SVG 要素を作成します。

(defn element-ns
  "Create a namespaced dom element"
  [namespace tag & args]
  (let [[tag attrs children] (normalize-args tag args)
        parent (. js/document createElementNS namespace (name tag))
        [parent children] (if (string? (first children))
                            [(set-text (element-ns namespace tag attrs) (first children))
                             (rest children)]
                            [parent children])]
    (doseq [[k v] attrs]
      (. parent setAttributeNS nil (name k) v))
    (apply append parent children)))

(defn build-svg
  "Build up a svg element from nested vectors."
  [x]
  (if (vector? x)
    (let [[parent children] (if (keyword? (first x))
                          [(apply element-ns "http://www.w3.org/2000/svg" (take-while element-arg? x))
                           (drop-while element-arg? x)]
                          [(first x) (rest x)])
       children (map build-svg children)]
       (apply append parent children))
    x))
于 2011-10-08T05:08:01.373 に答える
3

D3 JavaScript ライブラリの ClojureScript ラッパーである私のcljs-d3ライブラリに興味があるかもしれません。D3 は、SVG DOM を操作するための優れたツールです。

于 2011-10-24T04:11:52.957 に答える
2

Enlive for SVG の使用についてはどうですか? これは、いくつかのリアルタイム プロジェクトで使用する予定です。

于 2012-02-05T18:52:09.803 に答える