All Projects → DougHamil → threeagent

DougHamil / threeagent

Licence: MIT license
ClojureScript library for building Three.js apps in a reagent-like fashion

Programming Languages

clojure
4091 projects
javascript
184084 projects - #8 most used programming language

Projects that are alternatives of or similar to threeagent

Blueprint Js
The Javascript es6 version of the original furnishup/blueprint3d. Need some royalty free low poly models for the inventory. Can someone help me with this?
Stars: ✭ 208 (+67.74%)
Mutual labels:  threejs
React Three A11y
♿️ Accessibility tools for React Three Fiber
Stars: ✭ 226 (+82.26%)
Mutual labels:  threejs
J360
360 Video and Photo Capture in 4K for Three.js
Stars: ✭ 252 (+103.23%)
Mutual labels:  threejs
Ifc.js
Ifc viewer for client applications.
Stars: ✭ 211 (+70.16%)
Mutual labels:  threejs
Xplan
A rotating earth H5 page with Vue and threejs
Stars: ✭ 226 (+82.26%)
Mutual labels:  threejs
Pillar Valley
👾A cross-platform video game built with Expo, three.js, and Firebase! 🎮🕹
Stars: ✭ 242 (+95.16%)
Mutual labels:  threejs
Pathfinding Visualizer Threejs
A visualizer for pathfinding algorithms in 3D with maze generation, first-person view and device camera input.
Stars: ✭ 209 (+68.55%)
Mutual labels:  threejs
rough-cljs
A data-driven, reagent wrapper for RoughJS
Stars: ✭ 16 (-87.1%)
Mutual labels:  clojurescript-library
Terrain Builder
🏔 Procedural terrain using Three.js and perlin noise, Now Accelerated by your GPU!
Stars: ✭ 228 (+83.87%)
Mutual labels:  threejs
Px3d
Experimental pixel 3d engine
Stars: ✭ 252 (+103.23%)
Mutual labels:  threejs
Three Seed
A Three.js starter project with ES6 and Webpack
Stars: ✭ 213 (+71.77%)
Mutual labels:  threejs
Maptalks.three
A maptalks Layer to render with THREE.js.
Stars: ✭ 226 (+82.26%)
Mutual labels:  threejs
Webvr Ui
WebVR-UI Javascript library making it easy to create a button for entering VR mode
Stars: ✭ 244 (+96.77%)
Mutual labels:  threejs
Three.vrcontroller
Support hand controllers for Oculus, Vive, Windows Mixed Reality, Daydream, GearVR, and more by adding VRController to your existing Three.js-based WebVR project.
Stars: ✭ 213 (+71.77%)
Mutual labels:  threejs
Rthreejs
Three.js widgets for R and shiny
Stars: ✭ 251 (+102.42%)
Mutual labels:  threejs
Hdri To Cubemap
Image converter from spherical map to cubemap
Stars: ✭ 207 (+66.94%)
Mutual labels:  threejs
Webxr Emulator Extension
WebXR emulator extension
Stars: ✭ 231 (+86.29%)
Mutual labels:  threejs
re-frame-semantic-ui-react-github-widget
Using semantic-ui-react with re-frame - sample project
Stars: ✭ 21 (-83.06%)
Mutual labels:  reagent
reagent-quill
Basic reagent recipe for quill rich text editor
Stars: ✭ 16 (-87.1%)
Mutual labels:  reagent
Gpu Physics.js
GPGPU physics for Three.js
Stars: ✭ 246 (+98.39%)
Mutual labels:  threejs

threeagent

CircleCI cljdoc badge

ClojureScript library for building Three.js apps in a reagent-like fashion

Installation

Clojars Project

threeagent depends on THREE.js, so it will need to be added as a dependency to your project as well.

For shadow-cljs, install THREE.js using npm:

npm install --save three

For lein-cljsbuild, add an npm-deps entry on THREE.js:

:cljsbuild {:builds [{...
                      :compiler {...
                                 :install-deps true
                                 :npm-deps {:three "0.100.0"}}}]}

Example

(ns my-app.core
  (:require [threeagent.core :as th]))
  
;; Use reactive atom for storing state
(defonce state (th/atom {:ticks 0}))

;; Tick every second
(.setInterval js/window #(swap! state update :ticks inc) 1000)

;; Form-1 component example
(defn color-box [color size]
  [:box {:dims [size size size]
         :material {:color color}}])
         
;; Form-2 component example
(defn growing-sphere []
  (let [s (atom 0)]
    (.setInterval js/window #(swap! s inc) 5000)
    (fn []
      [:sphere {:radius @s}])))

;; Root component render function
(defn root []
  [:object {:position [1.0 0 -4.0]
            :rotation [0 (.sin js/Math (:ticks @state)) 0]} ; Rotate on Y axis based on :ticks
    [:ambient-light {:intensity 0.8}]
    [color-box "red" 1.0] ; Don't forget to use square brackets!
    [growing-sphere]])
           
           
;; Initialize and begin rendering threeagent scene
(defonce scene (th/render root (.-body js/document)))

Documentation

The latest documentation is available here

Development

Running Tests

Use shadow-cljs to watch unit tests

npx shadow-cljs watch test

Navigate to the HTTP server that shadow-cljs creates to view the test results

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].