d3.js + reactjs/om + clojurescript

d3-fun.cljs

(defn graph [app owner opts]
  (reify
    om/IInitState
    (init-state [_]
      (let [data (:data app)
            width (:width opts)
            height (:height opts)
            x (-> d3 .-time (.scale) (.range [0 width]))
            y (-> d3 .-scale (.linear) (.range [height 0])) ]
        {:width width
         :height height
         :margin (:margin opts)
         :x x :y y
         :brush (-> d3 .-svg (.brush) (.x x))
         :x-axis (-> d3 .-svg (.axis) (.scale x) (.orient "bottom"))
         :y-axis (-> d3 .-svg (.axis) (.scale y) (.orient "left"))}))
    om/IDidMount
    (did-mount [this]
      (let [brushg (om/get-node owner "brush")
            height (om/get-state owner :height)
            brush (om/get-state owner :brush)]
        (.log js/console brushg)
        (.log js/console brush)
        (-> d3
            (.select brushg)
            (.call brush)
            (.selectAll "rect")
            (.attr "y" -6)
            (.attr "height" (+ height 7)))))
    om/IRenderState
    (render-state [_ {:keys [x y data width height]}]
      (let [data (:data app)]
        (-> x (.domain
                (-> d3
                    (.extent
                      (map
                        (fn [{:keys [timestamp]}] timestamp)
                        data)))))
        (-> y (.domain [0 1]))
        (html [:svg {:height height
                     :width width
                     :ref "svg"}
               [:g {:class "data"}
                (for [d data]
                  [:rect {:color "red"
                          :height height
                          :width 2
                          :x (x (:timestamp d))}])]
               [:g {:class "brush" :ref "brush"}]]) ) )))