Database Reference
In-Depth Information
".interactive_force_layout();")
[:div
[:div#force.chart [:svg]]
[:div#datapane]]))
2.
We'll use the following route:
(defroutes
site-routes
(GET "/int-force" [] (interactive-force-plot))
(GET "/int-force/data.json" []
(redirect "/data/clusters.json"))
(route/resources "/")
(route/not-found "Page not found"))
3.
We'll need extra styles for the data panel. Open up
resources/css/style.css
and add these lines:
#datapane { float: right; width: 250px; }
#datapane dt { font-weight: bold; }
4.
Now, for this graph, let's open
src-cljs/webviz/int_force.cljs
and add this
namespace declaration:
(ns webviz.int-force
(:require [clojure.browser.dom :as dom]
[webviz.force :as force]
[goog.events :as gevents]))
5.
In the data panel, for each census item, we'll add a DT/DD element combination.
We'll encapsulate this into a function since we'll deine a number of these:
(defn dl-item [title data key]
(let [val2000 (aget data (str key "-2000"))]
(str "<dt>" title "</dt>"
"<dd>" (.round js/Math (aget data key))
" <em>(2000: "
(.round js/Math val2000)
")</em>"
"</dd>")))
6.
The most complicated function builds the HTML to populate the data panel,
as shown here:
(defn update-data [node]
(let [data (aget node "data")
content
