Skip to content

Instantly share code, notes, and snippets.

@haywoood
Created May 18, 2020
Embed
What would you like to do?
(defn mount-viz []
(let [svg (-> (d3/select "#chart")
(.append "svg")
(.attr "width" 800)
(.attr "height" 600)
(.append "g"))
x (-> (d3/scaleLinear)
(.domain #js [(d3/min data) (d3/max data)])
(.range #js [0 800]))
_ (-> (.append svg "g")
(.attr "transform" (str "translate(0," 600 ")"))
(.call (d3/axisBottom x)))
histogram (-> (d3/histogram)
(.value identity)
(.domain (.domain x))
(.thresholds (.ticks x 70)))
bins (histogram data)
y (-> (d3/scaleLinear)
(.range #js [600 0]))
_ (.domain y #js [0 (d3/max bins (fn [d] (.-length d)))])
_ (-> (.append svg "g")
(.call (d3/axisLeft y)))]
(-> (.selectAll svg "rect")
(.data bins)
(.enter)
(.append "rect")
(.attr "x" 1)
(.attr "transform"
(fn [d]
(str "translate(" (x (.-x0 d)) "," (y (.-length d)) ")")))
(.attr "width"
(fn [d]
(- (x (.-x1 d))
(x (.-x0 d))
-1)))
(.attr "height"
(fn [d]
(- 600 (y (.-length d)))))
(.style "fill" "#69b3a2"))))
(defn render []
(r/create-class
{:component-did-mount
(fn [this]
(mount-viz))
:render
(fn [this]
[:div#chart])}))
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment