This page is not created by, affiliated with, or supported by Slack Technologies, Inc.
2021-10-13
Channels
- # aleph (8)
- # announcements (3)
- # beginners (36)
- # calva (1)
- # cider (1)
- # circleci (3)
- # clj-kondo (9)
- # cljdoc (58)
- # clojars (7)
- # clojure (70)
- # clojure-europe (13)
- # clojure-japan (1)
- # clojure-nl (8)
- # clojure-russia (2)
- # clojure-uk (7)
- # clojuredesign-podcast (4)
- # clojurescript (67)
- # clojureverse-ops (14)
- # cursive (6)
- # data-science (1)
- # datahike (3)
- # datomic (6)
- # docker (1)
- # events (2)
- # figwheel-main (9)
- # fulcro (4)
- # graalvm (33)
- # graphql (8)
- # helix (1)
- # jobs (1)
- # leiningen (3)
- # lsp (39)
- # malli (9)
- # minecraft (31)
- # nextjournal (7)
- # off-topic (6)
- # portal (22)
- # re-frame (5)
- # reitit (5)
- # remote-jobs (1)
- # shadow-cljs (55)
- # sql (22)
- # tools-build (3)
- # tools-deps (4)
- # xtdb (6)
Would it be easy for a user (or a contributor) to add a new kind of viewer by writing some code to be interpreted by SCI in the client? Specifically, I'm imagining a viewer that will take a data structure like:
[:div
[:h1 "plot 1"]
['vega spec1]
[:h2 "plot 2"]
['vega spec2]]
and render the corresponding Reagent component.
Here, vega
is a reagent component to render a Vega spec, and spec1
, spec2
are two specific vega specs.
Variations of such a notation can help in converting notes from Oz / Gorilla-UI / Notespace / Goldly to Clerk.
(The above specific tools denote a vega component in different (but similar) ways: :vega
, :p/vega
, :p/vega
, 'vega
, respectively.)ok, with the caveats that this is impossible to figure out without knowing the internals and all still subject to change and the dev experience is terrible it does work:
;; # Hiccup Format Demo
(require '[nextjournal.clerk :as clerk]
'[nextjournal.clerk.viewer :as v]
'[clojure.walk :as walk])
(def data
[:div
[:h2 "plot 1"]
['vega {:width 650 :height 400 :data {:url ""
:format {:type "topojson" :feature "counties"}}
:transform [{:lookup "id" :from {:data {:url ""}
:key "id" :fields ["rate"]}}]
:projection {:type "albersUsa"} :mark "geoshape" :encoding {:color {:field "rate" :type "quantitative"}}}]
[:h2 "plot 2"]
['plotly {:data [{:z [[1 2 3] [3 2 1]]
:type "surface"}]}]])
(clerk/with-viewer
(fn [hiccup]
(let [symbols->viewers {'plotly :plotly
'vega :vega-lite}
vectors->viewers (fn [x]
(if (and (vector? x)
(= 2 (count x))
(symbols->viewers (first x)))
[v/inspect (v/with-viewer (symbols->viewers (first x)) (second x))]
x))]
(v/with-viewer :reagent (clojure.walk/postwalk vectors->viewers hiccup))))
data)
Thank you so much!
I'm seeing that sometimes when I create vega-lite visualizations, they work as expected until I restart the project. For a a few visualizations that I knew to work, when I jack in again with cider, they only return #object[Error Error: No reader function for tag array-buffer<object>]
.
can you also try upgrading Clerk to https://clojars.org/io.github.nextjournal/clerk/versions/0.1.176