qd-changjing/public/static/Build/Documentation/CatmullRomSpline.html

1283 lines
64 KiB
HTML
Raw Permalink Normal View History

2022-07-05 16:56:29 +08:00
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>CatmullRomSpline - Cesium Documentation</title>
<!--[if lt IE 9]>
<script src="javascript/html5.js"></script>
<![endif]-->
<link href="styles/jsdoc-default.css" rel="stylesheet">
<link href="styles/prism.css" rel="stylesheet">
</head>
<body>
<div id="main">
<h1 class="page-title">
<a href="index.html"><img src="Images/CesiumLogo.png" class="cesiumLogo"></a>
CatmullRomSpline
<div class="titleCenterer"></div>
</h1>
<section>
<header>
</header>
<article>
<div class="container-overview">
<div class="nameContainer">
<h4 class="name" id="CatmullRomSpline">
<a href="#CatmullRomSpline" class="doc-link"></a>
new Cesium.CatmullRomSpline<span class="signature">(options)</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Core/CatmullRomSpline.js#L148">Core/CatmullRomSpline.js 148</a>
</div>
</h4>
</div>
<div class="description">
A Catmull-Rom spline is a cubic spline where the tangent at control points,
except the first and last, are computed using the previous and next control points.
Catmull-Rom splines are in the class C<sup>1</sup>.
</div>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>options</code></td>
<td class="type">
<span class="param-type">Object</span>
</td>
<td class="description last">
Object with the following properties:
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>times</code></td>
<td class="type">
<span class="param-type">Array.&lt;Number></span>
</td>
<td class="description last">
An array of strictly increasing, unit-less, floating-point times at each point.
The values are in no way connected to the clock time. They are the parameterization for the curve.</td>
</tr>
<tr>
<td class="name"><code>points</code></td>
<td class="type">
<span class="param-type">Array.&lt;<a href="Cartesian3.html">Cartesian3</a>></span>
</td>
<td class="description last">
The array of <a href="Cartesian3.html"><code>Cartesian3</code></a> control points.</td>
</tr>
<tr>
<td class="name"><code>firstTangent</code></td>
<td class="type">
<span class="param-type"><a href="Cartesian3.html">Cartesian3</a></span>
</td>
<td class="description last">
<span class="optional">optional</span>
The tangent of the curve at the first control point.
If the tangent is not given, it will be estimated.</td>
</tr>
<tr>
<td class="name"><code>lastTangent</code></td>
<td class="type">
<span class="param-type"><a href="Cartesian3.html">Cartesian3</a></span>
</td>
<td class="description last">
<span class="optional">optional</span>
The tangent of the curve at the last control point.
If the tangent is not given, it will be estimated.</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<h5>Throws:</h5>
<ul>
<li>
<div class="param-desc">
<span class="param-type"><a href="DeveloperError.html">DeveloperError</a></span>
: points.length must be greater than or equal to 2.
</div>
</li>
<li>
<div class="param-desc">
<span class="param-type"><a href="DeveloperError.html">DeveloperError</a></span>
: times.length must be equal to points.length.
</div>
</li>
</ul>
<dl class="details">
<h5>Example:</h5>
<pre><code class="language-javascript">// spline above the earth from Philadelphia to Los Angeles
const spline = new Cesium.CatmullRomSpline({
times : [ 0.0, 1.5, 3.0, 4.5, 6.0 ],
points : [
new Cesium.Cartesian3(1235398.0, -4810983.0, 4146266.0),
new Cesium.Cartesian3(1372574.0, -5345182.0, 4606657.0),
new Cesium.Cartesian3(-757983.0, -5542796.0, 4514323.0),
new Cesium.Cartesian3(-2821260.0, -5248423.0, 4021290.0),
new Cesium.Cartesian3(-2539788.0, -4724797.0, 3620093.0)
]
});
const p0 = spline.evaluate(times[i]); // equal to positions[i]
const p1 = spline.evaluate(times[i] + delta); // interpolated value when delta &lt; times[i + 1] - times[i]</code></pre>
<h5>See:</h5>
<ul class="see-list">
<li><a href="HermiteSpline.html">HermiteSpline</a></li>
<li><a href="LinearSpline.html">LinearSpline</a></li>
<li><a href="QuaternionSpline.html">QuaternionSpline</a></li>
<li><a href="WeightSpline.html">WeightSpline</a></li>
</ul>
</dl>
</div>
<h3 class="subsection-title">Members</h3>
<div class="nameContainer">
<h4 class="name" id="firstTangent">
<a href="#firstTangent" class="doc-link"></a>
<span class="type-signature attribute-readonly">readonly</span> firstTangent<span class="type-signature"> : <a href="Cartesian3.html">Cartesian3</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Core/CatmullRomSpline.js#L233">Core/CatmullRomSpline.js 233</a>
</div>
</h4>
</div>
<div class="description">
The tangent at the first control point.
</div>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="lastTangent">
<a href="#lastTangent" class="doc-link"></a>
<span class="type-signature attribute-readonly">readonly</span> lastTangent<span class="type-signature"> : <a href="Cartesian3.html">Cartesian3</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Core/CatmullRomSpline.js#L247">Core/CatmullRomSpline.js 247</a>
</div>
</h4>
</div>
<div class="description">
The tangent at the last control point.
</div>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="points">
<a href="#points" class="doc-link"></a>
<span class="type-signature attribute-readonly">readonly</span> points<span class="type-signature"> : Array.&lt;<a href="Cartesian3.html">Cartesian3</a>></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Core/CatmullRomSpline.js#L219">Core/CatmullRomSpline.js 219</a>
</div>
</h4>
</div>
<div class="description">
An array of <a href="Cartesian3.html"><code>Cartesian3</code></a> control points.
</div>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="times">
<a href="#times" class="doc-link"></a>
<span class="type-signature attribute-readonly">readonly</span> times<span class="type-signature"> : Array.&lt;Number></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Core/CatmullRomSpline.js#L205">Core/CatmullRomSpline.js 205</a>
</div>
</h4>
</div>
<div class="description">
An array of times for the control points.
</div>
<dl class="details">
</dl>
<h3 class="subsection-title">Methods</h3>
<div class="nameContainer">
<h4 class="name" id="clampTime">
<a href="#clampTime" class="doc-link"></a>
clampTime<span class="signature">(time)</span> &rarr; <span class="type-signature returnType">Number</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Core/CatmullRomSpline.js#L306">Core/CatmullRomSpline.js 306</a>
</div>
</h4>
</div>
<div class="description">
Clamps the given time to the period covered by the spline.
</div>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>time</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">
The time.</td>
</tr>
</tbody>
</table>
<h5>Returns:</h5>
<div class="param-desc">
The time, clamped to the animation period.
</div>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="evaluate">
<a href="#evaluate" class="doc-link"></a>
evaluate<span class="signature">(time, <span class="optional">result</span>)</span> &rarr; <span class="type-signature returnType"><a href="Cartesian3.html">Cartesian3</a></span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Core/CatmullRomSpline.js#L319">Core/CatmullRomSpline.js 319</a>
</div>
</h4>
</div>
<div class="description">
Evaluates the curve at a given time.
</div>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>time</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">
The time at which to evaluate the curve.</td>
</tr>
<tr>
<td class="name"><code>result</code></td>
<td class="type">
<span class="param-type"><a href="Cartesian3.html">Cartesian3</a></span>
</td>
<td class="description last">
<span class="optional">optional</span>
The object onto which to store the result.</td>
</tr>
</tbody>
</table>
<h5>Returns:</h5>
<div class="param-desc">
The modified result parameter or a new instance of the point on the curve at the given time.
</div>
<h5>Throws:</h5>
<ul>
<li>
<div class="param-desc">
<span class="param-type"><a href="DeveloperError.html">DeveloperError</a></span>
: time must be in the range <code>[t<sub>0</sub>, t<sub>n</sub>]</code>, where <code>t<sub>0</sub></code>
is the first element in the array <code>times</code> and <code>t<sub>n</sub></code> is the last element
in the array <code>times</code>.
</div>
</li>
</ul>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="findTimeInterval">
<a href="#findTimeInterval" class="doc-link"></a>
findTimeInterval<span class="signature">(time)</span> &rarr; <span class="type-signature returnType">Number</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Core/CatmullRomSpline.js#L288">Core/CatmullRomSpline.js 288</a>
</div>
</h4>
</div>
<div class="description">
Finds an index <code>i</code> in <code>times</code> such that the parameter
<code>time</code> is in the interval <code>[times[i], times[i + 1]]</code>.
</div>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>time</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">
The time.</td>
</tr>
</tbody>
</table>
<h5>Returns:</h5>
<div class="param-desc">
The index for the element at the start of the interval.
</div>
<h5>Throws:</h5>
<ul>
<li>
<div class="param-desc">
<span class="param-type"><a href="DeveloperError.html">DeveloperError</a></span>
: time must be in the range <code>[t<sub>0</sub>, t<sub>n</sub>]</code>, where <code>t<sub>0</sub></code>
is the first element in the array <code>times</code> and <code>t<sub>n</sub></code> is the last element
in the array <code>times</code>.
</div>
</li>
</ul>
<dl class="details">
</dl>
<div class="nameContainer">
<h4 class="name" id="wrapTime">
<a href="#wrapTime" class="doc-link"></a>
wrapTime<span class="signature">(time)</span> &rarr; <span class="type-signature returnType">Number</span>
<div class="source-link rightLinks">
<a href="https://github.com/CesiumGS/cesium/blob/1.91/Source/Core/CatmullRomSpline.js#L297">Core/CatmullRomSpline.js 297</a>
</div>
</h4>
</div>
<div class="description">
Wraps the given time to the period covered by the spline.
</div>
<table class="params">
<thead>
<tr>
<th>Name</th>
<th>Type</th>
<th class="last">Description</th>
</tr>
</thead>
<tbody>
<tr>
<td class="name"><code>time</code></td>
<td class="type">
<span class="param-type">Number</span>
</td>
<td class="description last">
The time.</td>
</tr>
</tbody>
</table>
<h5>Returns:</h5>
<div class="param-desc">
The time, wrapped around to the updated animation.
</div>
<dl class="details">
</dl>
</article>
</section>
<footer>
Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.6.10</a>
</footer>
</div>
<div class="nav">
<div class="menu">
<input type="text" class="classFilter" id="ClassFilter" placeholder="Search">
<ul id="ClassList"><li data-name="Animation"><a href="Animation.html">Animation</a></li><li data-name="AnimationViewModel"><a href="AnimationViewModel.html">AnimationViewModel</a></li><li data-name="Appearance"><a href="Appearance.html">Appearance</a></li><li data-name="ArcGisMapServerImageryProvider"><a href="ArcGisMapServerImageryProvider.html">ArcGisMapServerImageryProvider</a></li><li data-name="ArcGISTiledElevationTerrainProvider"><a href="ArcGISTiledElevationTerrainProvider.html">ArcGISTiledElevationTerrainProvider</a></li><li data-name="ArcType"><a href="global.html#ArcType">ArcType</a></li><li data-name="AssociativeArray"><a href="AssociativeArray.html">AssociativeArray</a></li><li data-name="Axis"><a href="global.html#Axis">Axis</a></li><li data-name="AxisAlignedBoundingBox"><a href="AxisAlignedBoundingBox.html">AxisAlignedBoundingBox</a></li><li data-name="backFaceCulling"><a href="global.html#backFaceCulling">backFaceCulling</a></li><li data-name="barycentricCoordinates"><a href="global.html#barycentricCoordinates">barycentricCoordinates</a></li><li data-name="BaseLayerPicker"><a href="BaseLayerPicker.html">BaseLayerPicker</a></li><li data-name="BaseLayerPickerViewModel"><a href="BaseLayerPickerViewModel.html">BaseLayerPickerViewModel</a></li><li data-name="Billboard"><a href="Billboard.html">Billboard</a></li><li data-name="BillboardCollection"><a href="BillboardCollection.html">BillboardCollection</a></li><li data-name="BillboardGraphics"><a href="BillboardGraphics.html">BillboardGraphics</a></li><li data-name="BillboardVisualizer"><a href="BillboardVisualizer.html">BillboardVisualizer</a></li><li data-name="binarySearch"><a href="global.html#binarySearch">binarySearch</a></li><li data-name="binarySearchComparator"><a href="global.html#binarySearchComparator">binarySearchComparator</a></li><li data-name="BingMapsGeocoderService"><a href="BingMapsGeocoderService.html">BingMapsGeocoderService</a></li><li data-name="BingMapsImageryProvider"><a href="BingMapsImageryProvider.html">BingMapsImageryProvider</a></li><li data-name="BingMapsStyle"><a href="global.html#BingMapsStyle">BingMapsStyle</a></li><li data-name="BlendEquation"><a href="global.html#BlendEquation">BlendEquation</a></li><li data-name="BlendFunction"><a href="global.html#BlendFunction">BlendFunction</a></li><li data-name="BlendingState"><a href="BlendingState.html">BlendingState</a></li><li data-name="BlendOption"><a href="global.html#BlendOption">BlendOption</a></li><li data-name="BoundingRectangle"><a href="BoundingRectangle.html">BoundingRectangle</a></li><li data-name="BoundingSphere"><a href="BoundingSphere.html">BoundingSphere</a></li><li data-name="boundingSphere"><a href="global.html#boundingSphere">boundingSphere</a></li><li data-name="BoxEmitter"><a href="BoxEmitter.html">BoxEmitter</a></li><li data-name="BoxGeometry"><a href="BoxGeometry.html">BoxGeometry</a></li><li data-name="BoxGeometryUpdater"><a href="BoxGeometryUpdater.html">BoxGeometryUpdater</a></li><li data-name="BoxGraphics"><a href="BoxGraphics.html">BoxGraphics</a></li><li data-name="BoxOutlineGeometry"><a href="BoxOutlineGeometry.html">BoxOutlineGeometry</a></li><li data-name="buildModuleUrl"><a href="global.html#buildModuleUrl">buildModuleUrl</a></li><li data-name="CallbackProperty"><a href="CallbackProperty.html">CallbackProperty</a></li><li data-name="Camera"><a href="Camera.html">Camera</a></li><li data-name="CameraEventAggregator"><a href="CameraEventAggregator.html">CameraEventAggregator</a></li><li data-name="CameraEventType"><a href="global.html#CameraEventType">CameraEventType</a></li><li data-name="cancelAnimationFrame"><a href="global.html#cancelAnimationFrame">cancelAnimationFrame</a></li><li data-name="Cartesian2"><a href="Cartesian2.html">Cartesian2</a></li><li data-name="Cartesian3"><a href="Cartesian3.html">Cartesian3</a></li><li data-name="Cartesian4"><a href="Cartesian4.html">Cartesian4</a></li><li data-name="Cartographic"><a href="Cartographic.html">Cartographic</a></li><li data-name="CartographicGeocoderService"><a href="CartographicGeocoderServic
</div>
</div>
<script>
if (window.frameElement) {
document.body.className = 'embedded';
var ele = document.createElement('a');
ele.className = 'popout';
ele.target = '_blank';
ele.href = window.location.href;
ele.title = 'Pop out';
document.getElementById('main').appendChild(ele);
}
// Set targets on external links. Sandcastle and GitHub shouldn't be embedded in any iframe.
Array.prototype.forEach.call(document.getElementsByTagName('a'), function(a) {
if (/^https?:/i.test(a.getAttribute('href'))) {
a.target='_blank';
}
});
</script>
<script src="javascript/prism.js"></script>
<script src="javascript/cesiumDoc.js"></script>
</body>
</html>