coordinate.js 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194
  1. var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
  2. if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
  3. if (ar || !(i in from)) {
  4. if (!ar) ar = Array.prototype.slice.call(from, 0, i);
  5. ar[i] = from[i];
  6. }
  7. }
  8. return to.concat(ar || Array.prototype.slice.call(from));
  9. };
  10. import { deepMix, identity } from '@antv/util';
  11. import { mat3, vec3 } from '@antv/matrix-util';
  12. import { compose, isMatrix, extend } from './utils';
  13. import { cartesian, translate, custom, matrix, polar, transpose, scale, shearX, shearY, reflect, reflectX, reflectY, rotate, helix, parallel, fisheye, fisheyeX, fisheyeY, fisheyeCircular, } from './transforms';
  14. var Coordinate = /** @class */ (function () {
  15. /**
  16. * Create a new Coordinate Object.
  17. * @param options Custom options
  18. */
  19. function Coordinate(options) {
  20. // 当前的选项
  21. this.options = {
  22. x: 0,
  23. y: 0,
  24. width: 300,
  25. height: 150,
  26. transformations: [],
  27. };
  28. // 当前可以使用的变换
  29. this.transformers = {
  30. cartesian: cartesian,
  31. translate: translate,
  32. custom: custom,
  33. matrix: matrix,
  34. polar: polar,
  35. transpose: transpose,
  36. scale: scale,
  37. 'shear.x': shearX,
  38. 'shear.y': shearY,
  39. reflect: reflect,
  40. 'reflect.x': reflectX,
  41. 'reflect.y': reflectY,
  42. rotate: rotate,
  43. helix: helix,
  44. parallel: parallel,
  45. fisheye: fisheye,
  46. 'fisheye.x': fisheyeX,
  47. 'fisheye.y': fisheyeY,
  48. 'fisheye.circular': fisheyeCircular,
  49. };
  50. this.update(options);
  51. }
  52. /**
  53. * Update options and inner state.
  54. * @param options Options to be updated
  55. */
  56. Coordinate.prototype.update = function (options) {
  57. this.options = deepMix({}, this.options, options);
  58. this.recoordinate();
  59. };
  60. /**
  61. * Returns a new Coordinate with same options.
  62. * @returns Coordinate
  63. */
  64. Coordinate.prototype.clone = function () {
  65. return new Coordinate(this.options);
  66. };
  67. /**
  68. * Returns current options.
  69. * @returns options
  70. */
  71. Coordinate.prototype.getOptions = function () {
  72. return this.options;
  73. };
  74. /**
  75. * Clear transformations and update.
  76. */
  77. Coordinate.prototype.clear = function () {
  78. this.update({
  79. transformations: [],
  80. });
  81. };
  82. /**
  83. * Returns the size of the bounding box of the coordinate.
  84. * @returns [width, height]
  85. */
  86. Coordinate.prototype.getSize = function () {
  87. var _a = this.options, width = _a.width, height = _a.height;
  88. return [width, height];
  89. };
  90. /**
  91. * Returns the center of the bounding box of the coordinate.
  92. * @returns [centerX, centerY]
  93. */
  94. Coordinate.prototype.getCenter = function () {
  95. var _a = this.options, x = _a.x, y = _a.y, width = _a.width, height = _a.height;
  96. return [(x * 2 + width) / 2, (y * 2 + height) / 2];
  97. };
  98. /**
  99. * Add selected transformation.
  100. * @param args transform type and params
  101. * @returns Coordinate
  102. */
  103. Coordinate.prototype.transform = function () {
  104. var args = [];
  105. for (var _i = 0; _i < arguments.length; _i++) {
  106. args[_i] = arguments[_i];
  107. }
  108. var transformations = this.options.transformations;
  109. this.update({
  110. transformations: __spreadArray(__spreadArray([], transformations, true), [__spreadArray([], args, true)], false),
  111. });
  112. return this;
  113. };
  114. /**
  115. * Apples transformations for the current vector.
  116. * @param vector original vector2
  117. * @returns transformed vector2
  118. */
  119. Coordinate.prototype.map = function (vector) {
  120. return this.output(vector);
  121. };
  122. /**
  123. * Apples invert transformations for the current vector.
  124. * @param vector transformed vector2
  125. * @param vector original vector2
  126. */
  127. Coordinate.prototype.invert = function (vector) {
  128. return this.input(vector);
  129. };
  130. Coordinate.prototype.recoordinate = function () {
  131. this.output = this.compose();
  132. this.input = this.compose(true);
  133. };
  134. // 将所有的变换合成一个函数
  135. // 变换有两种类型:矩阵变换和函数变换
  136. // 处理过程中需要把连续的矩阵变换合成一个变换函数,然后在和其他变换函数合成最终的变换函数
  137. Coordinate.prototype.compose = function (invert) {
  138. if (invert === void 0) { invert = false; }
  139. var transformations = invert ? __spreadArray([], this.options.transformations, true).reverse() : this.options.transformations;
  140. var getter = invert ? function (d) { return d.untransform; } : function (d) { return d.transform; };
  141. var matrixes = [];
  142. var transforms = [];
  143. var add = function (transform, extended) {
  144. if (extended === void 0) { extended = true; }
  145. return transforms.push(extended ? extend(transform) : transform);
  146. };
  147. for (var _i = 0, transformations_1 = transformations; _i < transformations_1.length; _i++) {
  148. var _a = transformations_1[_i], name_1 = _a[0], args = _a.slice(1);
  149. var createTransformer = this.transformers[name_1];
  150. if (createTransformer) {
  151. var _b = this.options, x = _b.x, y = _b.y, width = _b.width, height = _b.height;
  152. var transformer = createTransformer(__spreadArray([], args, true), x, y, width, height);
  153. if (isMatrix(transformer)) {
  154. // 如果当前变换是矩阵变换,那么先保存下来
  155. matrixes.push(transformer);
  156. }
  157. else {
  158. // 如果当前变换是函数变换,并且之前有没有合成的矩阵变换,那么现将之前的矩阵变换合成
  159. if (matrixes.length) {
  160. var transform_1 = this.createMatrixTransform(matrixes, invert);
  161. add(transform_1);
  162. matrixes.splice(0, matrixes.length);
  163. }
  164. var transform = getter(transformer) || identity;
  165. add(transform, name_1 !== 'parallel'); // 对于非平行坐标系的变换需要扩展
  166. }
  167. }
  168. }
  169. // 合成剩下的矩阵变换
  170. if (matrixes.length) {
  171. var transform = this.createMatrixTransform(matrixes, invert);
  172. add(transform);
  173. }
  174. return compose.apply(void 0, transforms);
  175. };
  176. // 将连续的矩阵的运算合成一个变换函数
  177. Coordinate.prototype.createMatrixTransform = function (matrixes, invert) {
  178. var matrix = mat3.create();
  179. if (invert)
  180. matrixes.reverse();
  181. matrixes.forEach(function (m) { return mat3.mul(matrix, matrix, m); });
  182. if (invert) {
  183. mat3.invert(matrix, mat3.clone(matrix));
  184. }
  185. return function (vector) {
  186. var vector3 = [vector[0], vector[1], 1];
  187. vec3.transformMat3(vector3, vector3, matrix);
  188. return [vector3[0], vector3[1]];
  189. };
  190. };
  191. return Coordinate;
  192. }());
  193. export { Coordinate };
  194. //# sourceMappingURL=coordinate.js.map