Compare commits
4 Commits
b39efb5973
...
46cb373870
| Author | SHA1 | Date | |
|---|---|---|---|
|
46cb373870 | ||
|
|
9d4a7de5fc | ||
|
|
a538dc9241 | ||
|
|
746f5eb83d |
@ -8,6 +8,8 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="../">↩ Back to index</a>
|
||||
|
||||
<h1>Octahedron challenge</h1>
|
||||
<p>Can you create something like this using <a href="https://jsxgraph.org/docs/symbols/Point3D.html#constructor"><code>Point3D</code></a> and <a href="https://jsxgraph.org/docs/symbols/Polygon3D.html#constructor"><code>Polygon3D</code></a> elements? Don’t worry about including the colors; they’re just to emphasize how the polygons fit together.</p>
|
||||
<p>The <code>create</code> call for <code>Polygon3D</code> isn’t documented, but you can look at the polygon sampler for examples.</p>
|
||||
@ -129,5 +131,6 @@
|
||||
);
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
@ -8,16 +8,14 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="../">↩ Back to index</a>
|
||||
|
||||
<h1>Sphere contour challenge</h1>
|
||||
<p>Can you create something like this using <a href="https://jsxgraph.org/docs/symbols/Sphere3D.html#constructor"><code>Sphere3D</code></a>, <code>Plane3D</code>, and <a href="https://jsxgraph.org/docs/symbols/IntersectionCircle3D.html"><code>IntersectionCircle3D</code></a> elements? Don’t worry about including the colors; they’re just to clarify what happens when you move the center of the sphere.</p>
|
||||
<p>The <code>visible</code> attribute will come in handy.</p>
|
||||
<p>Since the <code>create</code> call for <code>Plane3D</code> isn’t documented, I’ve included an <a href="#create-plane">example</a> below.</p>
|
||||
<div id="sphere-contours" class="jxgbox" style="width:600px; height:600px"></div>
|
||||
|
||||
<h2 id="create-plane">How to create a 3D plane</h2>
|
||||
<p>A <code>Plane3D</code> is created from a base point and two vectors. The base point can be given either in coordinates or as a <a href="https://jsxgraph.org/docs/symbols/Point3D.html#constructor"><code>Point3D</code></a>. The vectors are given in coordinates.</p>
|
||||
<div id="plane-example" class="jxgbox" style="width:600px; height:600px"></div>
|
||||
|
||||
<!-- a solution to the sphere contour challenge -->
|
||||
<script type="text/javascript">
|
||||
// to prevent variable name conflicts, we define variables locally using `let`
|
||||
@ -89,6 +87,11 @@
|
||||
</script>
|
||||
|
||||
<!-- how to create a 3D plane -->
|
||||
|
||||
<h2 id="create-plane">How to create a 3D plane</h2>
|
||||
<p>A <code>Plane3D</code> is created from a base point and two vectors. The base point can be given either in coordinates or as a <a href="https://jsxgraph.org/docs/symbols/Point3D.html#constructor"><code>Point3D</code></a>. The vectors are given in coordinates.</p>
|
||||
<div id="plane-example" class="jxgbox" style="width:600px; height:600px"></div>
|
||||
|
||||
<script type="text/javascript">
|
||||
// to prevent variable name conflicts, we define variables locally using `let`
|
||||
// and put the code for each board in its own block
|
||||
|
||||
@ -8,6 +8,8 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="../../writing.html#jsxgraph-3d-workshop">↩ Back to writing</a>
|
||||
|
||||
<h1>A hands-on tour of some new 3D elements</h1>
|
||||
<p>These materials are from a <a href="https://jsxgraph.org/conf2024/program/fenyes/">short workshop</a> at the 2024 International JSXGraph Conference. You can watch a <a href="https://www.youtube.com/watch?v=gwc0BrLjuiI">video</a> of the workshop to learn more about how they were used. They’re available here, in a <a href="https://code.studioinfinity.org/Vectornaut/jsxgraph-3d-workshop">public Git repository</a>, and (for the templates) on JSFiddle.</p>
|
||||
|
||||
|
||||
@ -8,6 +8,8 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="../">↩ Back to index</a>
|
||||
|
||||
<h1>3D circle sampler</h1>
|
||||
|
||||
<p>A <a href="https://jsxgraph.org/docs/symbols/Circle3D.html"><code>Circle3D</code></a> element is created from a center, a normal vector, and a radius. The center can be given either in coordinates or as a <a href="https://jsxgraph.org/docs/symbols/Point3D.html#constructor"><code>Point3D</code></a>. The normal vector is given in coordinates.</p>
|
||||
|
||||
@ -8,6 +8,8 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="../">↩ Back to index</a>
|
||||
|
||||
<h1>3D glider sampler</h1>
|
||||
|
||||
<!-- line glider -->
|
||||
@ -299,7 +301,7 @@
|
||||
<!-- parametric surface glider -->
|
||||
|
||||
<h2>Parametric surface glider</h2>
|
||||
<p>The point is a glider on the parametric surface. This template is based on the <a href="https://github.com/jsxgraph/jsxgraph/blob/main/examples/parametricsurface3d_glider.html"><code>ParametricSurface3D</code> glider example</a> in the <a href="https://github.com/jsxgraph/jsxgraph/tree/main/examples">examples folder</a> included with the source code.</p>
|
||||
<p>The point is a glider on the parametric surface. This template is based on the <a href="https://github.com/jsxgraph/jsxgraph/blob/main/examples/parametricsurface3d_glider.html"><code>ParametricSurface3D</code> glider example</a> in the <a href="https://github.com/jsxgraph/jsxgraph/tree/main/examples">examples folder</a> included with the source code. Gliders on parametric surfaces have been available for a long time; this summer’s work just made their motion more intuitive by keeping them inside the surface’s parameter range.</p>
|
||||
<div id="surface-glider-board" class="jxgbox" style="width:600px; height:600px"></div>
|
||||
|
||||
<script type="text/javascript">
|
||||
|
||||
@ -8,6 +8,8 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="../">↩ Back to index</a>
|
||||
|
||||
<h1>3D intersection sampler</h1>
|
||||
|
||||
<!-- plane-plane -->
|
||||
|
||||
@ -8,6 +8,8 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="../">↩ Back to index</a>
|
||||
|
||||
<h1>3D polygon sampler</h1>
|
||||
|
||||
<!-- creating a polygon -->
|
||||
|
||||
@ -8,6 +8,8 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="../">↩ Back to index</a>
|
||||
|
||||
<h1>Sphere sampler</h1>
|
||||
|
||||
<!-- creating spheres -->
|
||||
|
||||
@ -8,6 +8,8 @@
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<a href="../">↩ Back to index</a>
|
||||
|
||||
<h1>View options demo</h1>
|
||||
|
||||
<!-- central projection; depth ordering for points -->
|
||||
|
||||
Loading…
Reference in New Issue
Block a user