You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
93 lines
2.9 KiB
93 lines
2.9 KiB
2 years ago
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8" />
|
||
|
|
<base href="../../../../" />
|
||
|
|
<script src="page.js"></script>
|
||
|
|
<link type="text/css" rel="stylesheet" href="page.css" />
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<h1>[name]</h1>
|
||
|
|
|
||
|
|
<p class="desc">
|
||
|
|
This class is used to convert a series of shapes to an array of [page:Path]s, for example an SVG shape to a
|
||
|
|
path (see the example below).
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h2>Examples</h2>
|
||
|
|
<p>
|
||
|
|
[example:webgl_geometry_extrude_shapes2 geometry / extrude / shapes2]
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h2>Constructor</h2>
|
||
|
|
|
||
|
|
|
||
|
|
<h3>[name]( )</h3>
|
||
|
|
<p>
|
||
|
|
Creates a new ShapePath. Unlike a [page:Path], no points are passed in as the ShapePath is designed to
|
||
|
|
be generated after creation.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
|
||
|
|
<h2>Properties</h2>
|
||
|
|
|
||
|
|
<h3>[property:Array subPaths]</h3>
|
||
|
|
<p>
|
||
|
|
Array of [page:Path]s.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>[property:Array currentPath]</h3>
|
||
|
|
<p>
|
||
|
|
The current [page:Path] that is being generated.
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>[property:Color color]</h3>
|
||
|
|
<p>[page:Color] of the shape, by default set to white (0xffffff).</p>
|
||
|
|
|
||
|
|
<h2>Methods</h2>
|
||
|
|
|
||
|
|
<h3>[method:this moveTo]( [param:Float x], [param:Float y] )</h3>
|
||
|
|
<p>
|
||
|
|
Starts a new [page:Path] and calls [page:Path.moveTo]( x, y ) on that [page:Path].
|
||
|
|
Also points [page:ShapePath.currentPath currentPath] to that [page:Path].
|
||
|
|
</p>
|
||
|
|
|
||
|
|
<h3>[method:this lineTo]( [param:Float x], [param:Float y] )</h3>
|
||
|
|
<p>This creates a line from the [page:ShapePath.currentPath currentPath]'s
|
||
|
|
offset to X and Y and updates the offset to X and Y.</p>
|
||
|
|
|
||
|
|
<h3>[method:this quadraticCurveTo]( [param:Float cpX], [param:Float cpY], [param:Float x], [param:Float y] )</h3>
|
||
|
|
<p>This creates a quadratic curve from the [page:ShapePath.currentPath currentPath]'s
|
||
|
|
offset to x and y with cpX and cpY as control point and updates the [page:ShapePath.currentPath currentPath]'s
|
||
|
|
offset to x and y.</p>
|
||
|
|
|
||
|
|
<h3>[method:this bezierCurveTo]( [param:Float cp1X], [param:Float cp1Y], [param:Float cp2X], [param:Float cp2Y], [param:Float x], [param:Float y] )</h3>
|
||
|
|
<p>This creates a bezier curve from the [page:ShapePath.currentPath currentPath]'s
|
||
|
|
offset to x and y with cp1X, cp1Y and cp2X, cp2Y as control points and updates the
|
||
|
|
[page:ShapePath.currentPath currentPath]'s offset to x and y.</p>
|
||
|
|
|
||
|
|
<h3>[method:this splineThru] ( [param:Array points] ) </h3>
|
||
|
|
<p>points - An array of [page:Vector2]s</p>
|
||
|
|
<p>Connects a new [page:SplineCurve] onto the [page:ShapePath.currentPath currentPath].</p>
|
||
|
|
|
||
|
|
|
||
|
|
<h3>[method:Array toShapes]( [param:Boolean isCCW] )</h3>
|
||
|
|
<p>
|
||
|
|
isCCW -- Changes how solids and holes are generated
|
||
|
|
</p>
|
||
|
|
<p>
|
||
|
|
Converts the [page:ShapePath.subPaths subPaths] array into an array of Shapes. By default solid shapes are defined clockwise (CW) and holes are defined counterclockwise (CCW). If isCCW is set to true,
|
||
|
|
then those are flipped.
|
||
|
|
<br/>
|
||
|
|
|
||
|
|
</p>
|
||
|
|
|
||
|
|
|
||
|
|
<h2>Source</h2>
|
||
|
|
|
||
|
|
<p>
|
||
|
|
[link:https://github.com/mrdoob/three.js/blob/master/src/extras/core/ShapePath.js src/extras/core/ShapePath.js]
|
||
|
|
</p>
|
||
|
|
</body>
|
||
|
|
</html>
|