createClipPathFromCoordSys.js 3.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. /*
  2. * Licensed to the Apache Software Foundation (ASF) under one
  3. * or more contributor license agreements. See the NOTICE file
  4. * distributed with this work for additional information
  5. * regarding copyright ownership. The ASF licenses this file
  6. * to you under the Apache License, Version 2.0 (the
  7. * "License"); you may not use this file except in compliance
  8. * with the License. You may obtain a copy of the License at
  9. *
  10. * http://www.apache.org/licenses/LICENSE-2.0
  11. *
  12. * Unless required by applicable law or agreed to in writing,
  13. * software distributed under the License is distributed on an
  14. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  15. * KIND, either express or implied. See the License for the
  16. * specific language governing permissions and limitations
  17. * under the License.
  18. */
  19. var graphic = require("../../util/graphic");
  20. var _number = require("../../util/number");
  21. var round = _number.round;
  22. /*
  23. * Licensed to the Apache Software Foundation (ASF) under one
  24. * or more contributor license agreements. See the NOTICE file
  25. * distributed with this work for additional information
  26. * regarding copyright ownership. The ASF licenses this file
  27. * to you under the Apache License, Version 2.0 (the
  28. * "License"); you may not use this file except in compliance
  29. * with the License. You may obtain a copy of the License at
  30. *
  31. * http://www.apache.org/licenses/LICENSE-2.0
  32. *
  33. * Unless required by applicable law or agreed to in writing,
  34. * software distributed under the License is distributed on an
  35. * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
  36. * KIND, either express or implied. See the License for the
  37. * specific language governing permissions and limitations
  38. * under the License.
  39. */
  40. function createGridClipPath(cartesian, hasAnimation, seriesModel) {
  41. var rect = cartesian.getArea();
  42. var isHorizontal = cartesian.getBaseAxis().isHorizontal();
  43. var x = rect.x;
  44. var y = rect.y;
  45. var width = rect.width;
  46. var height = rect.height;
  47. var lineWidth = seriesModel.get('lineStyle.width') || 2; // Expand the clip path a bit to avoid the border is clipped and looks thinner
  48. x -= lineWidth / 2;
  49. y -= lineWidth / 2;
  50. width += lineWidth;
  51. height += lineWidth; // fix: https://github.com/apache/incubator-echarts/issues/11369
  52. x = Math.floor(x);
  53. width = Math.round(width);
  54. var clipPath = new graphic.Rect({
  55. shape: {
  56. x: x,
  57. y: y,
  58. width: width,
  59. height: height
  60. }
  61. });
  62. if (hasAnimation) {
  63. clipPath.shape[isHorizontal ? 'width' : 'height'] = 0;
  64. graphic.initProps(clipPath, {
  65. shape: {
  66. width: width,
  67. height: height
  68. }
  69. }, seriesModel);
  70. }
  71. return clipPath;
  72. }
  73. function createPolarClipPath(polar, hasAnimation, seriesModel) {
  74. var sectorArea = polar.getArea(); // Avoid float number rounding error for symbol on the edge of axis extent.
  75. var clipPath = new graphic.Sector({
  76. shape: {
  77. cx: round(polar.cx, 1),
  78. cy: round(polar.cy, 1),
  79. r0: round(sectorArea.r0, 1),
  80. r: round(sectorArea.r, 1),
  81. startAngle: sectorArea.startAngle,
  82. endAngle: sectorArea.endAngle,
  83. clockwise: sectorArea.clockwise
  84. }
  85. });
  86. if (hasAnimation) {
  87. clipPath.shape.endAngle = sectorArea.startAngle;
  88. graphic.initProps(clipPath, {
  89. shape: {
  90. endAngle: sectorArea.endAngle
  91. }
  92. }, seriesModel);
  93. }
  94. return clipPath;
  95. }
  96. function createClipPath(coordSys, hasAnimation, seriesModel) {
  97. if (!coordSys) {
  98. return null;
  99. } else if (coordSys.type === 'polar') {
  100. return createPolarClipPath(coordSys, hasAnimation, seriesModel);
  101. } else if (coordSys.type === 'cartesian2d') {
  102. return createGridClipPath(coordSys, hasAnimation, seriesModel);
  103. }
  104. return null;
  105. }
  106. exports.createGridClipPath = createGridClipPath;
  107. exports.createPolarClipPath = createPolarClipPath;
  108. exports.createClipPath = createClipPath;