|
| 1 | +<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> |
| 2 | +<html xmlns="http://www.w3.org/1999/xhtml"><!-- InstanceBegin template="/Templates/template.dwt" codeOutsideHTMLIsLocked="false" --> |
| 3 | +<head> |
| 4 | +<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> |
| 5 | +<!-- InstanceBeginEditable name="doctitle" --> |
| 6 | +<title>compound</title> |
| 7 | +<!-- InstanceEndEditable --> |
| 8 | +<!-- InstanceBeginEditable name="head" --> |
| 9 | +<link href="VisualRef.css" rel="stylesheet" type="text/css" /> |
| 10 | +<style type="text/css"> |
| 11 | +<!-- |
| 12 | +.style1 {font-size: x-large} |
| 13 | +.style2 {font-size: xx-large} |
| 14 | +--> |
| 15 | +</style> |
| 16 | +<!-- InstanceEndEditable --> |
| 17 | +<link href="VisualRef.css" rel="stylesheet" type="text/css" /> |
| 18 | +</head> |
| 19 | + |
| 20 | +<body> |
| 21 | +<table width="230" height="30" border="0"> |
| 22 | + <tr> |
| 23 | + <td width="66"><a name="top" id="top"></a><a href="index.html"><strong>Home</strong></a></td> |
| 24 | + <td width="154"><span class="Normal"><a href="primitives.html"><strong>Pictures</strong></a> of 3D objects</span></td> |
| 25 | + </tr> |
| 26 | +</table> |
| 27 | +<table width="438" height="30" border="0"> |
| 28 | + <tr> |
| 29 | + <td width="151"><select id="menu1" onchange="jumpMenu(this)"> |
| 30 | + </select></td> |
| 31 | + <td width="163"><select id="menu2" onchange="jumpMenu(this)"> |
| 32 | + </select></td> |
| 33 | + <td width="110"><select id="menu3" onchange="jumpMenu(this)"> |
| 34 | + </select></td> |
| 35 | + </tr> |
| 36 | +</table> |
| 37 | +<table width="454" border="0" cellpadding="0" cellspacing="0"> |
| 38 | + <!--DWLayoutDefaultTable--> |
| 39 | + <tr> |
| 40 | + <td width="454" rowspan="2" valign="top"><!-- InstanceBeginEditable name="content" --> |
| 41 | + <div> |
| 42 | + <table width="100%" height="83" border="1"> |
| 43 | + <tr> |
| 44 | + <td width="67%" height="77"><div align="center"><span class="style1 style2"><font color="#0000A0">extrusion</font></span></div></td> |
| 45 | + <td width="33%"><div align="center"><a href="arrow.html"></a><img src="images/extrusion.PNG" width="147" height="149" alt="extrusion" /></div></td> |
| 46 | + </tr> |
| 47 | + </table> |
| 48 | + </div> |
| 49 | + <div> |
| 50 | + <p class="Normal">The extrusion object extrudes a 2D shape along a path. Here is an <strong><a href="http://www.glowscript.org/#/user/GlowScriptDemos/folder/Examples/program/Extrusions" target="_blank">example</a></strong>.</p> |
| 51 | + <p class="Normal">The GlowScript extrusion object is currently more limited than the classic VPython extrusion object. Here is the minimal syntax:</p> |
| 52 | + <p align="center" class="program">ex = extrusion(pos=..., shape=...)</p> |
| 53 | + <p class="Normal"> The <span class="attribute">pos</span> attribute is a list of points like the <span class="attribute">pos</span> attribute of a curve object. The <span class="attribute">shape</span> attribute is a list of x-y pairs describing the perimeter of a 2D surface, such as<span class="program">[ [2,0], [0,4], [-2,0], [2,0] ]</span>. </p> |
| 54 | + <p class="Normal"><strong><font color="#0000a0">The three steps to make an extrusion</font></strong></p> |
| 55 | + <p class="Normal"><strong>1)</strong> Create a 2D shape, either by giving a list of points or by choosing a shape from a supplied library of common shapes. Here are two examples. The first creates a triangle by providing 3 points to the Polygon function. The second creates a circular shape from a library of shapes, and the third creates a rectangular shape (it is intended to provide a larger variety of shapes in the future.)</p> |
| 56 | + <p class="program">tri = [ [2,0], [0,4], [-2,0], [2,0] ]</p> |
| 57 | + <p class="program">circ = shapes.circle(radius=0.8)</p> |
| 58 | + <p class="program">rect = shapes.rectangle(width=0.2, <br /> |
| 59 | + height=0.4)<br /> |
| 60 | + </p> |
| 61 | + <p class="Normal">Currently a shape must be closed. That is, the last point must be the same as the first point.</p> |
| 62 | + <p class="Normal"><strong>2)</strong> Create a path along which to extrude your shape (just like the <span class="attribute">pos</span> attribute of a curve object), either by giving a list of points or by choosing a path from a supplied library of common paths. Here are two examples. The first is a triangular path. The second chooses a circular path in the xz plane, and the third chooses a rectangular path in the xz plane.</p> |
| 63 | + <p class="program">tripath = [ vec(1,0,0), vec(0,0,-2), <br /> |
| 64 | + vec(-1,0,0], vec(1,0,0) ]</p> |
| 65 | + <p class="program">circpath = paths.circle(radius=3)</p> |
| 66 | + <p class="program">rectpath = paths.rectangle(width=4, <br /> |
| 67 | + height=2)<br /> |
| 68 | + </p> |
| 69 | + <p class="Normal">Currently a path must be closed. That is, the last point must be the same as the first point.</p> |
| 70 | + <p class="Normal"><strong>3)</strong> Create an extrusion object to extrude your shape along your path. For example, using paths and shapes defined above,</p> |
| 71 | + <p class="program">extrusion(pos=circpath, shape=rect) </p> |
| 72 | + <div> |
| 73 | + <div> |
| 74 | + <div> |
| 75 | + <div> |
| 76 | + <div> |
| 77 | + <div></div> |
| 78 | + </div> |
| 79 | + <p class="Normal"><strong><font color="#0000a0">Path direction</font></strong></p> |
| 80 | + <p class="Normal">The paths in the paths library all go counterclockwise in the xz plane, as seen from above. That is, if starting from a position on the x axis, they head in the -z direction and bend toward the left. If your shape has something sticking out on the right, it will be on the outer side of the extrusion, whereas something sticking out on the left will be on the inner side of the extrusion.</p> |
| 81 | + <div> |
| 82 | + <div></div> |
| 83 | + </div> |
| 84 | + <p class="Normal"><strong><font color="#0000a0">Dynamic change of attributes</font></strong></p> |
| 85 | + <div> |
| 86 | + <div></div> |
| 87 | + </div> |
| 88 | + </div> |
| 89 | + </div> |
| 90 | + <p class="Normal">The extrusion object is rendered quite rapidly, so unusual effects are possible. An extrusion object is treated like a compound object, and you can dynamically change its pos (a vector), axis, size, color, and up attributes, as with other objects.</p> |
| 91 | + <p class="Normal"><strong><font color="#0000a0">How the extrusion machinery works</font></strong></p> |
| 92 | + <p class="Normal">At every point along the <span class="attribute">pos</span> path this point plus the preceding and following points define a plane. A 2D plane is established perpendicular to the tangent to the circle at this point. The 2D shape is drawn in this 2D plane. A shape should be positioned so that its center is approximately at the location of the <span class="attribute">pos</span> locations. If you offset the shape far from the path, you may get odd results, because there is enhanced danger of two adjacent drawing planes intersecting each other. Also, making sharp turns of wide extrusions may lead to one segment overlapping another. </p> |
| 93 | + <p class="Normal">If the bending angle from one point to the next is large, the fitted circle is abandoned, and the orientation of the 2D plane is determined from the direction from the previous point to the current point and the direction from the current point to the next point, giving a mitered joint. The bending angle is considered to be large if its cosine if greater than 0.95 (an angle of about 18 degrees). </p> |
| 94 | + </div> |
| 95 | + <div></div> |
| 96 | + </div> |
| 97 | + <!-- InstanceEndEditable --></td> |
| 98 | + </tr> |
| 99 | +</table> |
| 100 | +<p><a href="#top"><strong>Top of page</strong></a></p> |
| 101 | +</body> |
| 102 | +<script type="text/javascript" language="javascript" src="navigation.js"></script> |
| 103 | +<!-- InstanceEnd --></html> |
0 commit comments