Skip to content

Instantly share code, notes, and snippets.

@mooreryan
Created October 10, 2019 02:43
Show Gist options
  • Save mooreryan/772f1256b1ef8da864fc55b611b34742 to your computer and use it in GitHub Desktop.
Save mooreryan/772f1256b1ef8da864fc55b611b34742 to your computer and use it in GitHub Desktop.
(ns cljs_reagent_proj.core
(:require
[reagent.core :as r]
[cljsjs.react-vis :as rvis]))
(def chart-data [{:x 1 :y 1}
{:x 2 :y 2}
{:x 3 :y 4}
{:x 4 :y 5}
{:x 5 :y 4}
{:x 6 :y 6}
{:x 7 :y 8}
{:x 8 :y 6}
{:x 9 :y 5}
{:x 10 :y 5}])
(def axis-style {:line {:stroke "#333"}
:ticks {:stroke "#999"}
:text {:stroke "none"
:fill "#333"}})
(defn line-chart [data]
[:> rvis/XYPlot
{:width 800
:height 225
:margin {:left 50 :right 50}}
[:> rvis/XAxis {:style axis-style}]
[:> rvis/YAxis {:style axis-style}]
[:> rvis/LineSeries
{:data data
:color "#e47320"
:strokeWidth 5
:style {:fill "none"
:strokeLinejoin "round"
:strokeLinecap "round"}}]])
(defn app-scaffold []
[:div
[line-chart chart-data]])
(defn render-app []
(r/render [app-scaffold]
(.getElementById js/document "app")))
(render-app)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment