Last active
June 24, 2016 19:13
-
-
Save robert-spurrier/4738fb35cf0455a213e1a2ebfa144523 to your computer and use it in GitHub Desktop.
Ohio, rendered by Clojurescript and d3
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <meta charset="utf-8"> | |
| <style> | |
| #map { | |
| width: 1200px; height: 600px; | |
| } | |
| #states { | |
| fill: none; | |
| stroke: #555555; | |
| stroke-width: 0.5px; | |
| } | |
| </style> | |
| <body> | |
| <div id="map"></div> | |
| <script type="text/javascript" src="d3/d3.js"></script> | |
| <script type="text/javascript" src="out/ohio.js"></script> | |
| </body> |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| (ns ohio | |
| (:require [strokes :refer [d3]])) | |
| (strokes/bootstrap) | |
| (def width 1200) | |
| (def height 600) | |
| (def svg (-> d3 (.select "#map") (.append "svg") | |
| (.attr {:width width | |
| :height height}))) | |
| (def draw-root (-> svg (.append "g"))) | |
| (def proj-fn (-> d3 .-geo .albersUsa (.scale 2000) | |
| (.translate [ (/ width 9) (/ height 2)]))) | |
| (def path-fn (-> d3 .-geo .path (.projection proj-fn))) | |
| (defn render [maproot] | |
| (-> draw-root | |
| (.append "g") | |
| (.attr "id" "states") | |
| (.selectAll "path") | |
| (.data (aget maproot "features")) | |
| (.enter) | |
| (.append "path") | |
| (.attr "d" path-fn) | |
| (.style "fill", (fn [d] | |
| (if-let [fill (.-FILL | |
| (.-properties d))] | |
| fill))))) | |
| (-> d3 (.json "ohiocounties.geojson" (fn [error1, maproot] | |
| (if-let [error error1] | |
| (-> (.html (aget error "response"))) | |
| (render maproot))))) |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| (defproject ohio "0.0.1-SNAPSHOT" | |
| :description "ohio" | |
| :dependencies [[org.clojure/clojure "1.5.1"] | |
| [net.drib/strokes "0.5.0"]] | |
| :min-lein-version "2.0.0" | |
| :source-paths ["src/clj" "src/cljs"] | |
| :plugins [[lein-cljsbuild "0.3.2"]] | |
| :cljsbuild {:builds [{:source-paths ["src/cljs"] | |
| :compiler { :output-to "public/out/ohio.js" | |
| :pretty-print true | |
| :optimizations :simple}}]}) |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment