PolylineGeometry.js 17 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547
  1. import ArcType from "./ArcType.js";
  2. import arrayRemoveDuplicates from "./arrayRemoveDuplicates.js";
  3. import BoundingSphere from "./BoundingSphere.js";
  4. import Cartesian3 from "./Cartesian3.js";
  5. import Color from "./Color.js";
  6. import ComponentDatatype from "./ComponentDatatype.js";
  7. import defaultValue from "./defaultValue.js";
  8. import defined from "./defined.js";
  9. import DeveloperError from "./DeveloperError.js";
  10. import Ellipsoid from "./Ellipsoid.js";
  11. import Geometry from "./Geometry.js";
  12. import GeometryAttribute from "./GeometryAttribute.js";
  13. import GeometryAttributes from "./GeometryAttributes.js";
  14. import GeometryType from "./GeometryType.js";
  15. import IndexDatatype from "./IndexDatatype.js";
  16. import CesiumMath from "./Math.js";
  17. import PolylinePipeline from "./PolylinePipeline.js";
  18. import PrimitiveType from "./PrimitiveType.js";
  19. import VertexFormat from "./VertexFormat.js";
  20. var scratchInterpolateColorsArray = [];
  21. function interpolateColors(p0, p1, color0, color1, numPoints) {
  22. var colors = scratchInterpolateColorsArray;
  23. colors.length = numPoints;
  24. var i;
  25. var r0 = color0.red;
  26. var g0 = color0.green;
  27. var b0 = color0.blue;
  28. var a0 = color0.alpha;
  29. var r1 = color1.red;
  30. var g1 = color1.green;
  31. var b1 = color1.blue;
  32. var a1 = color1.alpha;
  33. if (Color.equals(color0, color1)) {
  34. for (i = 0; i < numPoints; i++) {
  35. colors[i] = Color.clone(color0);
  36. }
  37. return colors;
  38. }
  39. var redPerVertex = (r1 - r0) / numPoints;
  40. var greenPerVertex = (g1 - g0) / numPoints;
  41. var bluePerVertex = (b1 - b0) / numPoints;
  42. var alphaPerVertex = (a1 - a0) / numPoints;
  43. for (i = 0; i < numPoints; i++) {
  44. colors[i] = new Color(
  45. r0 + i * redPerVertex,
  46. g0 + i * greenPerVertex,
  47. b0 + i * bluePerVertex,
  48. a0 + i * alphaPerVertex
  49. );
  50. }
  51. return colors;
  52. }
  53. /**
  54. * A description of a polyline modeled as a line strip; the first two positions define a line segment,
  55. * and each additional position defines a line segment from the previous position. The polyline is capable of
  56. * displaying with a material.
  57. *
  58. * @alias PolylineGeometry
  59. * @constructor
  60. *
  61. * @param {Object} options Object with the following properties:
  62. * @param {Cartesian3[]} options.positions An array of {@link Cartesian3} defining the positions in the polyline as a line strip.
  63. * @param {Number} [options.width=1.0] The width in pixels.
  64. * @param {Color[]} [options.colors] An Array of {@link Color} defining the per vertex or per segment colors.
  65. * @param {Boolean} [options.colorsPerVertex=false] A boolean that determines whether the colors will be flat across each segment of the line or interpolated across the vertices.
  66. * @param {ArcType} [options.arcType=ArcType.GEODESIC] The type of line the polyline segments must follow.
  67. * @param {Number} [options.granularity=CesiumMath.RADIANS_PER_DEGREE] The distance, in radians, between each latitude and longitude if options.arcType is not ArcType.NONE. Determines the number of positions in the buffer.
  68. * @param {VertexFormat} [options.vertexFormat=VertexFormat.DEFAULT] The vertex attributes to be computed.
  69. * @param {Ellipsoid} [options.ellipsoid=Ellipsoid.WGS84] The ellipsoid to be used as a reference.
  70. *
  71. * @exception {DeveloperError} At least two positions are required.
  72. * @exception {DeveloperError} width must be greater than or equal to one.
  73. * @exception {DeveloperError} colors has an invalid length.
  74. *
  75. * @see PolylineGeometry#createGeometry
  76. *
  77. * @demo {@link https://sandcastle.cesium.com/index.html?src=Polyline.html|Cesium Sandcastle Polyline Demo}
  78. *
  79. * @example
  80. * // A polyline with two connected line segments
  81. * var polyline = new Cesium.PolylineGeometry({
  82. * positions : Cesium.Cartesian3.fromDegreesArray([
  83. * 0.0, 0.0,
  84. * 5.0, 0.0,
  85. * 5.0, 5.0
  86. * ]),
  87. * width : 10.0
  88. * });
  89. * var geometry = Cesium.PolylineGeometry.createGeometry(polyline);
  90. */
  91. function PolylineGeometry(options) {
  92. options = defaultValue(options, defaultValue.EMPTY_OBJECT);
  93. var positions = options.positions;
  94. var colors = options.colors;
  95. var width = defaultValue(options.width, 1.0);
  96. var colorsPerVertex = defaultValue(options.colorsPerVertex, false);
  97. //>>includeStart('debug', pragmas.debug);
  98. if (!defined(positions) || positions.length < 2) {
  99. throw new DeveloperError("At least two positions are required.");
  100. }
  101. if (typeof width !== "number") {
  102. throw new DeveloperError("width must be a number");
  103. }
  104. if (
  105. defined(colors) &&
  106. ((colorsPerVertex && colors.length < positions.length) ||
  107. (!colorsPerVertex && colors.length < positions.length - 1))
  108. ) {
  109. throw new DeveloperError("colors has an invalid length.");
  110. }
  111. //>>includeEnd('debug');
  112. this._positions = positions;
  113. this._colors = colors;
  114. this._width = width;
  115. this._colorsPerVertex = colorsPerVertex;
  116. this._vertexFormat = VertexFormat.clone(
  117. defaultValue(options.vertexFormat, VertexFormat.DEFAULT)
  118. );
  119. this._arcType = defaultValue(options.arcType, ArcType.GEODESIC);
  120. this._granularity = defaultValue(
  121. options.granularity,
  122. CesiumMath.RADIANS_PER_DEGREE
  123. );
  124. this._ellipsoid = Ellipsoid.clone(
  125. defaultValue(options.ellipsoid, Ellipsoid.WGS84)
  126. );
  127. this._workerName = "createPolylineGeometry";
  128. var numComponents = 1 + positions.length * Cartesian3.packedLength;
  129. numComponents += defined(colors) ? 1 + colors.length * Color.packedLength : 1;
  130. /**
  131. * The number of elements used to pack the object into an array.
  132. * @type {Number}
  133. */
  134. this.packedLength =
  135. numComponents + Ellipsoid.packedLength + VertexFormat.packedLength + 4;
  136. }
  137. /**
  138. * Stores the provided instance into the provided array.
  139. *
  140. * @param {PolylineGeometry} value The value to pack.
  141. * @param {Number[]} array The array to pack into.
  142. * @param {Number} [startingIndex=0] The index into the array at which to start packing the elements.
  143. *
  144. * @returns {Number[]} The array that was packed into
  145. */
  146. PolylineGeometry.pack = function (value, array, startingIndex) {
  147. //>>includeStart('debug', pragmas.debug);
  148. if (!defined(value)) {
  149. throw new DeveloperError("value is required");
  150. }
  151. if (!defined(array)) {
  152. throw new DeveloperError("array is required");
  153. }
  154. //>>includeEnd('debug');
  155. startingIndex = defaultValue(startingIndex, 0);
  156. var i;
  157. var positions = value._positions;
  158. var length = positions.length;
  159. array[startingIndex++] = length;
  160. for (i = 0; i < length; ++i, startingIndex += Cartesian3.packedLength) {
  161. Cartesian3.pack(positions[i], array, startingIndex);
  162. }
  163. var colors = value._colors;
  164. length = defined(colors) ? colors.length : 0.0;
  165. array[startingIndex++] = length;
  166. for (i = 0; i < length; ++i, startingIndex += Color.packedLength) {
  167. Color.pack(colors[i], array, startingIndex);
  168. }
  169. Ellipsoid.pack(value._ellipsoid, array, startingIndex);
  170. startingIndex += Ellipsoid.packedLength;
  171. VertexFormat.pack(value._vertexFormat, array, startingIndex);
  172. startingIndex += VertexFormat.packedLength;
  173. array[startingIndex++] = value._width;
  174. array[startingIndex++] = value._colorsPerVertex ? 1.0 : 0.0;
  175. array[startingIndex++] = value._arcType;
  176. array[startingIndex] = value._granularity;
  177. return array;
  178. };
  179. var scratchEllipsoid = Ellipsoid.clone(Ellipsoid.UNIT_SPHERE);
  180. var scratchVertexFormat = new VertexFormat();
  181. var scratchOptions = {
  182. positions: undefined,
  183. colors: undefined,
  184. ellipsoid: scratchEllipsoid,
  185. vertexFormat: scratchVertexFormat,
  186. width: undefined,
  187. colorsPerVertex: undefined,
  188. arcType: undefined,
  189. granularity: undefined,
  190. };
  191. /**
  192. * Retrieves an instance from a packed array.
  193. *
  194. * @param {Number[]} array The packed array.
  195. * @param {Number} [startingIndex=0] The starting index of the element to be unpacked.
  196. * @param {PolylineGeometry} [result] The object into which to store the result.
  197. * @returns {PolylineGeometry} The modified result parameter or a new PolylineGeometry instance if one was not provided.
  198. */
  199. PolylineGeometry.unpack = function (array, startingIndex, result) {
  200. //>>includeStart('debug', pragmas.debug);
  201. if (!defined(array)) {
  202. throw new DeveloperError("array is required");
  203. }
  204. //>>includeEnd('debug');
  205. startingIndex = defaultValue(startingIndex, 0);
  206. var i;
  207. var length = array[startingIndex++];
  208. var positions = new Array(length);
  209. for (i = 0; i < length; ++i, startingIndex += Cartesian3.packedLength) {
  210. positions[i] = Cartesian3.unpack(array, startingIndex);
  211. }
  212. length = array[startingIndex++];
  213. var colors = length > 0 ? new Array(length) : undefined;
  214. for (i = 0; i < length; ++i, startingIndex += Color.packedLength) {
  215. colors[i] = Color.unpack(array, startingIndex);
  216. }
  217. var ellipsoid = Ellipsoid.unpack(array, startingIndex, scratchEllipsoid);
  218. startingIndex += Ellipsoid.packedLength;
  219. var vertexFormat = VertexFormat.unpack(
  220. array,
  221. startingIndex,
  222. scratchVertexFormat
  223. );
  224. startingIndex += VertexFormat.packedLength;
  225. var width = array[startingIndex++];
  226. var colorsPerVertex = array[startingIndex++] === 1.0;
  227. var arcType = array[startingIndex++];
  228. var granularity = array[startingIndex];
  229. if (!defined(result)) {
  230. scratchOptions.positions = positions;
  231. scratchOptions.colors = colors;
  232. scratchOptions.width = width;
  233. scratchOptions.colorsPerVertex = colorsPerVertex;
  234. scratchOptions.arcType = arcType;
  235. scratchOptions.granularity = granularity;
  236. return new PolylineGeometry(scratchOptions);
  237. }
  238. result._positions = positions;
  239. result._colors = colors;
  240. result._ellipsoid = Ellipsoid.clone(ellipsoid, result._ellipsoid);
  241. result._vertexFormat = VertexFormat.clone(vertexFormat, result._vertexFormat);
  242. result._width = width;
  243. result._colorsPerVertex = colorsPerVertex;
  244. result._arcType = arcType;
  245. result._granularity = granularity;
  246. return result;
  247. };
  248. var scratchCartesian3 = new Cartesian3();
  249. var scratchPosition = new Cartesian3();
  250. var scratchPrevPosition = new Cartesian3();
  251. var scratchNextPosition = new Cartesian3();
  252. /**
  253. * Computes the geometric representation of a polyline, including its vertices, indices, and a bounding sphere.
  254. *
  255. * @param {PolylineGeometry} polylineGeometry A description of the polyline.
  256. * @returns {Geometry|undefined} The computed vertices and indices.
  257. */
  258. PolylineGeometry.createGeometry = function (polylineGeometry) {
  259. var width = polylineGeometry._width;
  260. var vertexFormat = polylineGeometry._vertexFormat;
  261. var colors = polylineGeometry._colors;
  262. var colorsPerVertex = polylineGeometry._colorsPerVertex;
  263. var arcType = polylineGeometry._arcType;
  264. var granularity = polylineGeometry._granularity;
  265. var ellipsoid = polylineGeometry._ellipsoid;
  266. var i;
  267. var j;
  268. var k;
  269. var positions = arrayRemoveDuplicates(
  270. polylineGeometry._positions,
  271. Cartesian3.equalsEpsilon
  272. );
  273. var positionsLength = positions.length;
  274. // A width of a pixel or less is not a valid geometry, but in order to support external data
  275. // that may have errors we treat this as an empty geometry.
  276. if (positionsLength < 2 || width <= 0.0) {
  277. return undefined;
  278. }
  279. if (arcType === ArcType.GEODESIC || arcType === ArcType.RHUMB) {
  280. var subdivisionSize;
  281. var numberOfPointsFunction;
  282. if (arcType === ArcType.GEODESIC) {
  283. subdivisionSize = CesiumMath.chordLength(
  284. granularity,
  285. ellipsoid.maximumRadius
  286. );
  287. numberOfPointsFunction = PolylinePipeline.numberOfPoints;
  288. } else {
  289. subdivisionSize = granularity;
  290. numberOfPointsFunction = PolylinePipeline.numberOfPointsRhumbLine;
  291. }
  292. var heights = PolylinePipeline.extractHeights(positions, ellipsoid);
  293. if (defined(colors)) {
  294. var colorLength = 1;
  295. for (i = 0; i < positionsLength - 1; ++i) {
  296. colorLength += numberOfPointsFunction(
  297. positions[i],
  298. positions[i + 1],
  299. subdivisionSize
  300. );
  301. }
  302. var newColors = new Array(colorLength);
  303. var newColorIndex = 0;
  304. for (i = 0; i < positionsLength - 1; ++i) {
  305. var p0 = positions[i];
  306. var p1 = positions[i + 1];
  307. var c0 = colors[i];
  308. var numColors = numberOfPointsFunction(p0, p1, subdivisionSize);
  309. if (colorsPerVertex && i < colorLength) {
  310. var c1 = colors[i + 1];
  311. var interpolatedColors = interpolateColors(p0, p1, c0, c1, numColors);
  312. var interpolatedColorsLength = interpolatedColors.length;
  313. for (j = 0; j < interpolatedColorsLength; ++j) {
  314. newColors[newColorIndex++] = interpolatedColors[j];
  315. }
  316. } else {
  317. for (j = 0; j < numColors; ++j) {
  318. newColors[newColorIndex++] = Color.clone(c0);
  319. }
  320. }
  321. }
  322. newColors[newColorIndex] = Color.clone(colors[colors.length - 1]);
  323. colors = newColors;
  324. scratchInterpolateColorsArray.length = 0;
  325. }
  326. if (arcType === ArcType.GEODESIC) {
  327. positions = PolylinePipeline.generateCartesianArc({
  328. positions: positions,
  329. minDistance: subdivisionSize,
  330. ellipsoid: ellipsoid,
  331. height: heights,
  332. });
  333. } else {
  334. positions = PolylinePipeline.generateCartesianRhumbArc({
  335. positions: positions,
  336. granularity: subdivisionSize,
  337. ellipsoid: ellipsoid,
  338. height: heights,
  339. });
  340. }
  341. }
  342. positionsLength = positions.length;
  343. var size = positionsLength * 4.0 - 4.0;
  344. var finalPositions = new Float64Array(size * 3);
  345. var prevPositions = new Float64Array(size * 3);
  346. var nextPositions = new Float64Array(size * 3);
  347. var expandAndWidth = new Float32Array(size * 2);
  348. var st = vertexFormat.st ? new Float32Array(size * 2) : undefined;
  349. var finalColors = defined(colors) ? new Uint8Array(size * 4) : undefined;
  350. var positionIndex = 0;
  351. var expandAndWidthIndex = 0;
  352. var stIndex = 0;
  353. var colorIndex = 0;
  354. var position;
  355. for (j = 0; j < positionsLength; ++j) {
  356. if (j === 0) {
  357. position = scratchCartesian3;
  358. Cartesian3.subtract(positions[0], positions[1], position);
  359. Cartesian3.add(positions[0], position, position);
  360. } else {
  361. position = positions[j - 1];
  362. }
  363. Cartesian3.clone(position, scratchPrevPosition);
  364. Cartesian3.clone(positions[j], scratchPosition);
  365. if (j === positionsLength - 1) {
  366. position = scratchCartesian3;
  367. Cartesian3.subtract(
  368. positions[positionsLength - 1],
  369. positions[positionsLength - 2],
  370. position
  371. );
  372. Cartesian3.add(positions[positionsLength - 1], position, position);
  373. } else {
  374. position = positions[j + 1];
  375. }
  376. Cartesian3.clone(position, scratchNextPosition);
  377. var color0, color1;
  378. if (defined(finalColors)) {
  379. if (j !== 0 && !colorsPerVertex) {
  380. color0 = colors[j - 1];
  381. } else {
  382. color0 = colors[j];
  383. }
  384. if (j !== positionsLength - 1) {
  385. color1 = colors[j];
  386. }
  387. }
  388. var startK = j === 0 ? 2 : 0;
  389. var endK = j === positionsLength - 1 ? 2 : 4;
  390. for (k = startK; k < endK; ++k) {
  391. Cartesian3.pack(scratchPosition, finalPositions, positionIndex);
  392. Cartesian3.pack(scratchPrevPosition, prevPositions, positionIndex);
  393. Cartesian3.pack(scratchNextPosition, nextPositions, positionIndex);
  394. positionIndex += 3;
  395. var direction = k - 2 < 0 ? -1.0 : 1.0;
  396. expandAndWidth[expandAndWidthIndex++] = 2 * (k % 2) - 1; // expand direction
  397. expandAndWidth[expandAndWidthIndex++] = direction * width;
  398. if (vertexFormat.st) {
  399. st[stIndex++] = j / (positionsLength - 1);
  400. st[stIndex++] = Math.max(expandAndWidth[expandAndWidthIndex - 2], 0.0);
  401. }
  402. if (defined(finalColors)) {
  403. var color = k < 2 ? color0 : color1;
  404. finalColors[colorIndex++] = Color.floatToByte(color.red);
  405. finalColors[colorIndex++] = Color.floatToByte(color.green);
  406. finalColors[colorIndex++] = Color.floatToByte(color.blue);
  407. finalColors[colorIndex++] = Color.floatToByte(color.alpha);
  408. }
  409. }
  410. }
  411. var attributes = new GeometryAttributes();
  412. attributes.position = new GeometryAttribute({
  413. componentDatatype: ComponentDatatype.DOUBLE,
  414. componentsPerAttribute: 3,
  415. values: finalPositions,
  416. });
  417. attributes.prevPosition = new GeometryAttribute({
  418. componentDatatype: ComponentDatatype.DOUBLE,
  419. componentsPerAttribute: 3,
  420. values: prevPositions,
  421. });
  422. attributes.nextPosition = new GeometryAttribute({
  423. componentDatatype: ComponentDatatype.DOUBLE,
  424. componentsPerAttribute: 3,
  425. values: nextPositions,
  426. });
  427. attributes.expandAndWidth = new GeometryAttribute({
  428. componentDatatype: ComponentDatatype.FLOAT,
  429. componentsPerAttribute: 2,
  430. values: expandAndWidth,
  431. });
  432. if (vertexFormat.st) {
  433. attributes.st = new GeometryAttribute({
  434. componentDatatype: ComponentDatatype.FLOAT,
  435. componentsPerAttribute: 2,
  436. values: st,
  437. });
  438. }
  439. if (defined(finalColors)) {
  440. attributes.color = new GeometryAttribute({
  441. componentDatatype: ComponentDatatype.UNSIGNED_BYTE,
  442. componentsPerAttribute: 4,
  443. values: finalColors,
  444. normalize: true,
  445. });
  446. }
  447. var indices = IndexDatatype.createTypedArray(size, positionsLength * 6 - 6);
  448. var index = 0;
  449. var indicesIndex = 0;
  450. var length = positionsLength - 1.0;
  451. for (j = 0; j < length; ++j) {
  452. indices[indicesIndex++] = index;
  453. indices[indicesIndex++] = index + 2;
  454. indices[indicesIndex++] = index + 1;
  455. indices[indicesIndex++] = index + 1;
  456. indices[indicesIndex++] = index + 2;
  457. indices[indicesIndex++] = index + 3;
  458. index += 4;
  459. }
  460. return new Geometry({
  461. attributes: attributes,
  462. indices: indices,
  463. primitiveType: PrimitiveType.TRIANGLES,
  464. boundingSphere: BoundingSphere.fromPoints(positions),
  465. geometryType: GeometryType.POLYLINES,
  466. });
  467. };
  468. export default PolylineGeometry;