path.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. exports.linePathToAreaPath = exports.getAreaLineY = exports.dataToPath = exports.getSmoothLinePath = exports.getLinePath = void 0;
  4. var tslib_1 = require("tslib");
  5. var path_util_1 = require("@antv/path-util");
  6. var scale_1 = require("@antv/scale");
  7. var util_1 = require("@antv/util");
  8. /**
  9. * 点数组转 path
  10. * @param points
  11. */
  12. function pointsToPath(points) {
  13. return util_1.map(points, function (p, idx) {
  14. var command = idx === 0 ? 'M' : 'L';
  15. var x = p[0], y = p[1];
  16. return [command, x, y];
  17. });
  18. }
  19. /**
  20. * 将点连接成路径 path
  21. * @param points
  22. */
  23. function getLinePath(points) {
  24. return pointsToPath(points);
  25. }
  26. exports.getLinePath = getLinePath;
  27. /**
  28. * 将点连成平滑的曲线
  29. * @param points
  30. */
  31. function getSmoothLinePath(points) {
  32. if (points.length <= 2) {
  33. // 两点以内直接绘制成路径
  34. return getLinePath(points);
  35. }
  36. var data = [];
  37. util_1.each(points, function (p) {
  38. // 当前点和上一个点一样的时候,忽略掉
  39. if (!util_1.isEqual(p, data.slice(data.length - 2))) {
  40. data.push(p[0], p[1]);
  41. }
  42. });
  43. // const constraint = [ // 范围
  44. // [ 0, 0 ],
  45. // [ 1, 1 ],
  46. // ];
  47. var path = path_util_1.catmullRom2Bezier(data, false);
  48. var _a = util_1.head(points), x = _a[0], y = _a[1];
  49. path.unshift(['M', x, y]);
  50. return path;
  51. }
  52. exports.getSmoothLinePath = getSmoothLinePath;
  53. /**
  54. * 将数据转成 path,利用 scale 的归一化能力
  55. * @param data
  56. * @param width
  57. * @param height
  58. * @param smooth
  59. */
  60. function dataToPath(data, width, height, smooth) {
  61. if (smooth === void 0) { smooth = true; }
  62. // 利用 scale 来获取 y 上的映射
  63. var y = new scale_1.Linear({
  64. values: data,
  65. });
  66. var x = new scale_1.Category({
  67. values: util_1.map(data, function (v, idx) { return idx; }),
  68. });
  69. var points = util_1.map(data, function (v, idx) {
  70. return [x.scale(idx) * width, height - y.scale(v) * height];
  71. });
  72. return smooth ? getSmoothLinePath(points) : getLinePath(points);
  73. }
  74. exports.dataToPath = dataToPath;
  75. /**
  76. * 获得 area 面积的横向连接线的 px 位置
  77. * @param data
  78. * @param width
  79. * @param height
  80. */
  81. function getAreaLineY(data, height) {
  82. var y = new scale_1.Linear({
  83. values: data,
  84. });
  85. // 当曲线全部为负数时,取最大值,当曲线全部为正数时,取最小值,当曲线有正有负,则取零点
  86. var lineY = y.max < 0 ? y.max : Math.max(0, y.min);
  87. return height - y.scale(lineY) * height;
  88. }
  89. exports.getAreaLineY = getAreaLineY;
  90. /**
  91. * 线 path 转 area path
  92. * @param path
  93. * @param width
  94. * @param height
  95. */
  96. function linePathToAreaPath(path, width, height, data) {
  97. var areaPath = tslib_1.__spreadArrays(path);
  98. var lineYPx = getAreaLineY(data, height);
  99. areaPath.push(['L', width, lineYPx]);
  100. areaPath.push(['L', 0, lineYPx]);
  101. areaPath.push(['Z']);
  102. return areaPath;
  103. }
  104. exports.linePathToAreaPath = linePathToAreaPath;
  105. //# sourceMappingURL=path.js.map