fyquah / gmapscljs-example

An example using gmapscljs

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

gmapscljs-example

A (very simple) example of using gmapscljs.

Demo

http://www.fyquah.me/projects/gmapscljs/

A quick walkthrough

; Create a atom of path
(def points (atom (make-points)))

; The main component is later rendered to the DOM using reagent/create-class
(defn main-component
  ([]
   [:div
    [:h1 "gmapscljs-example"]
    [:button
     {:on-click
      #(reset! points (make-points))}
     "Click me!"]
     ; in a hiccup like syntax, google-maps
     [google-maps {:style {:height 500}
                   :center (lat-lon 50 10)
                   :zoom 2}
      ; Declare components inside the google-maps
      ; component, you do not need to specify the map
      ; which is bind to, gmapscljs will do the magic!
      ; (There is a gotcha to this, refer gmapscljs'
      ; REAMDE)
      ; Draw a path between all the points!
      [polyline {:path @points
                 :key @points}]
      ; Have markers to indicate the points!
      ; Everything the points atom is mutated,
      ; this will re-draw / re-render itself
      (for [point @points]
        [marker {:key point
                 :position point}])]]))

About

An example using gmapscljs


Languages

Language:Clojure 72.7%Language:HTML 13.3%Language:Shell 7.4%Language:Batchfile 6.6%