Add examples

examples/ThreeJS.ipynb

@@ -0,0 +1,133 @@
+{
+ "cells": [
+  {
+   "cell_type": "markdown",
+   "id": "ef130086",
+   "metadata": {},
+   "source": [
+    "# ThreeJS\n",
+    "\n",
+    "<https://threejs.org/docs/index.html#manual/en/introduction/Creating-a-scene>"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 1,
+   "id": "aea2bcf3",
+   "metadata": {},
+   "outputs": [],
+   "source": [
+    "USE {\n",
+    "    repositories {\n",
+    "        maven(\"https://s01.oss.sonatype.org/content/repositories/releases/\")\n",
+    "    }\n",
+    "\n",
+    "    dependencies {\n",
+    "        implementation(\"dev.yidafu.jupyter:jupyter-js:0.7.0\")\n",
+    "    }\n",
+    "}"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": 10,
+   "id": "ace45101",
+   "metadata": {},
+   "outputs": [
+    {
+     "data": {
+      "text/html": [
+       "\n",
+       "<div id=\"e8f17336-8943-404b-a0f4-9976b4b4992c\" style=\"width:100%;min-height:100px\"></div>\n",
+       "<script type=\"module\">\n",
+       "function getCellRoot(width = \"100%\", height = \"100px\") {\n",
+       "    var cellRoot = document.getElementById(\"e8f17336-8943-404b-a0f4-9976b4b4992c\");\n",
+       "    cellRoot.style = `width: ${width};height: ${height}`\n",
+       "    return cellRoot;\n",
+       "}\n",
+       " \n",
+       " import * as THREE from 'https://cdn.jsdelivr.net/npm/three@v0.149.0/build/three.module.js';\n",
+       "const scene = new THREE.Scene();\n",
+       "const camera = new THREE.PerspectiveCamera(75, 600 / 600, 0.1, 600);\n",
+       "const renderer = new THREE.WebGLRenderer();\n",
+       "renderer.setSize(600, 600);\n",
+       "renderer.setAnimationLoop(animate);\n",
+       "getCellRoot('100%', '600px').appendChild(renderer.domElement);\n",
+       "const geometry = new THREE.BoxGeometry(1, 1, 1);\n",
+       "const material = new THREE.MeshBasicMaterial({\n",
+       "    color: 0x00ff00\n",
+       "});\n",
+       "const cube = new THREE.Mesh(geometry, material);\n",
+       "scene.add(cube);\n",
+       "camera.position.z = 5;\n",
+       "function animate() {\n",
+       "    cube.rotation.x += 0.01;\n",
+       "    cube.rotation.y += 0.01;\n",
+       "    renderer.render(scene, camera);\n",
+       "}\n",
+       " \n",
+       "</script>\n"
+      ]
+     },
+     "execution_count": 10,
+     "metadata": {},
+     "output_type": "execute_result"
+    }
+   ],
+   "source": [
+    "%js\n",
+    "\n",
+    "import * as THREE from 'https://cdn.jsdelivr.net/npm/three@v0.149.0/build/three.module.js';\n",
+    "\n",
+    "const scene = new THREE.Scene();\n",
+    "const camera = new THREE.PerspectiveCamera(75, 600 / 600, 0.1, 600);\n",
+    "\n",
+    "const renderer = new THREE.WebGLRenderer();\n",
+    "renderer.setSize(600, 600);\n",
+    "renderer.setAnimationLoop(animate);\n",
+    "getCellRoot('100%', '600px').appendChild(renderer.domElement);\n",
+    "\n",
+    "const geometry = new THREE.BoxGeometry(1, 1, 1);\n",
+    "const material = new THREE.MeshBasicMaterial({ color: 0x00ff00 });\n",
+    "const cube = new THREE.Mesh(geometry, material);\n",
+    "scene.add(cube);\n",
+    "\n",
+    "camera.position.z = 5;\n",
+    "\n",
+    "function animate() {\n",
+    "\n",
+    "  cube.rotation.x += 0.01;\n",
+    "  cube.rotation.y += 0.01;\n",
+    "\n",
+    "  renderer.render(scene, camera);\n",
+    "}"
+   ]
+  },
+  {
+   "cell_type": "code",
+   "execution_count": null,
+   "id": "777154eb",
+   "metadata": {},
+   "outputs": [],
+   "source": []
+  }
+ ],
+ "metadata": {
+  "kernelspec": {
+   "display_name": "Kotlin",
+   "language": "kotlin",
+   "name": "kotlin"
+  },
+  "language_info": {
+   "codemirror_mode": "text/x-kotlin",
+   "file_extension": ".kt",
+   "mimetype": "text/x-kotlin",
+   "name": "kotlin",
+   "nbconvert_exporter": "",
+   "pygments_lexer": "kotlin",
+   "version": "1.8.20"
+  }
+ },
+ "nbformat": 4,
+ "nbformat_minor": 5
+}