Eighth code snapshot from https://www.tenderisthebyte.com/blog/2019/10/09/clojurescript-reagent-react-vis/

cljs-reagent-react-vis-snapshot-8.cljs

(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)