basicTransition.js 8.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243
  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. /**
  20. * AUTO-GENERATED FILE. DO NOT MODIFY.
  21. */
  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. import { isFunction, isObject, retrieve2 } from 'zrender/lib/core/util.js';
  41. import { makeInner } from '../util/model.js';
  42. // Stored properties for further transition.
  43. export var transitionStore = makeInner();
  44. /**
  45. * Return null if animation is disabled.
  46. */
  47. export function getAnimationConfig(animationType, animatableModel, dataIndex,
  48. // Extra opts can override the option in animatable model.
  49. extraOpts,
  50. // TODO It's only for pictorial bar now.
  51. extraDelayParams) {
  52. var animationPayload;
  53. // Check if there is global animation configuration from dataZoom/resize can override the config in option.
  54. // If animation is enabled. Will use this animation config in payload.
  55. // If animation is disabled. Just ignore it.
  56. if (animatableModel && animatableModel.ecModel) {
  57. var updatePayload = animatableModel.ecModel.getUpdatePayload();
  58. animationPayload = updatePayload && updatePayload.animation;
  59. }
  60. var animationEnabled = animatableModel && animatableModel.isAnimationEnabled();
  61. var isUpdate = animationType === 'update';
  62. if (animationEnabled) {
  63. var duration = void 0;
  64. var easing = void 0;
  65. var delay = void 0;
  66. if (extraOpts) {
  67. duration = retrieve2(extraOpts.duration, 200);
  68. easing = retrieve2(extraOpts.easing, 'cubicOut');
  69. delay = 0;
  70. } else {
  71. duration = animatableModel.getShallow(isUpdate ? 'animationDurationUpdate' : 'animationDuration');
  72. easing = animatableModel.getShallow(isUpdate ? 'animationEasingUpdate' : 'animationEasing');
  73. delay = animatableModel.getShallow(isUpdate ? 'animationDelayUpdate' : 'animationDelay');
  74. }
  75. // animation from payload has highest priority.
  76. if (animationPayload) {
  77. animationPayload.duration != null && (duration = animationPayload.duration);
  78. animationPayload.easing != null && (easing = animationPayload.easing);
  79. animationPayload.delay != null && (delay = animationPayload.delay);
  80. }
  81. if (isFunction(delay)) {
  82. delay = delay(dataIndex, extraDelayParams);
  83. }
  84. if (isFunction(duration)) {
  85. duration = duration(dataIndex);
  86. }
  87. var config = {
  88. duration: duration || 0,
  89. delay: delay,
  90. easing: easing
  91. };
  92. return config;
  93. } else {
  94. return null;
  95. }
  96. }
  97. function animateOrSetProps(animationType, el, props, animatableModel, dataIndex, cb, during) {
  98. var isFrom = false;
  99. var removeOpt;
  100. if (isFunction(dataIndex)) {
  101. during = cb;
  102. cb = dataIndex;
  103. dataIndex = null;
  104. } else if (isObject(dataIndex)) {
  105. cb = dataIndex.cb;
  106. during = dataIndex.during;
  107. isFrom = dataIndex.isFrom;
  108. removeOpt = dataIndex.removeOpt;
  109. dataIndex = dataIndex.dataIndex;
  110. }
  111. var isRemove = animationType === 'leave';
  112. if (!isRemove) {
  113. // Must stop the remove animation.
  114. el.stopAnimation('leave');
  115. }
  116. var animationConfig = getAnimationConfig(animationType, animatableModel, dataIndex, isRemove ? removeOpt || {} : null, animatableModel && animatableModel.getAnimationDelayParams ? animatableModel.getAnimationDelayParams(el, dataIndex) : null);
  117. if (animationConfig && animationConfig.duration > 0) {
  118. var duration = animationConfig.duration;
  119. var animationDelay = animationConfig.delay;
  120. var animationEasing = animationConfig.easing;
  121. var animateConfig = {
  122. duration: duration,
  123. delay: animationDelay || 0,
  124. easing: animationEasing,
  125. done: cb,
  126. force: !!cb || !!during,
  127. // Set to final state in update/init animation.
  128. // So the post processing based on the path shape can be done correctly.
  129. setToFinal: !isRemove,
  130. scope: animationType,
  131. during: during
  132. };
  133. isFrom ? el.animateFrom(props, animateConfig) : el.animateTo(props, animateConfig);
  134. } else {
  135. el.stopAnimation();
  136. // If `isFrom`, the props is the "from" props.
  137. !isFrom && el.attr(props);
  138. // Call during at least once.
  139. during && during(1);
  140. cb && cb();
  141. }
  142. }
  143. /**
  144. * Update graphic element properties with or without animation according to the
  145. * configuration in series.
  146. *
  147. * Caution: this method will stop previous animation.
  148. * So do not use this method to one element twice before
  149. * animation starts, unless you know what you are doing.
  150. * @example
  151. * graphic.updateProps(el, {
  152. * position: [100, 100]
  153. * }, seriesModel, dataIndex, function () { console.log('Animation done!'); });
  154. * // Or
  155. * graphic.updateProps(el, {
  156. * position: [100, 100]
  157. * }, seriesModel, function () { console.log('Animation done!'); });
  158. */
  159. function updateProps(el, props,
  160. // TODO: TYPE AnimatableModel
  161. animatableModel, dataIndex, cb, during) {
  162. animateOrSetProps('update', el, props, animatableModel, dataIndex, cb, during);
  163. }
  164. export { updateProps };
  165. /**
  166. * Init graphic element properties with or without animation according to the
  167. * configuration in series.
  168. *
  169. * Caution: this method will stop previous animation.
  170. * So do not use this method to one element twice before
  171. * animation starts, unless you know what you are doing.
  172. */
  173. export function initProps(el, props, animatableModel, dataIndex, cb, during) {
  174. animateOrSetProps('enter', el, props, animatableModel, dataIndex, cb, during);
  175. }
  176. /**
  177. * If element is removed.
  178. * It can determine if element is having remove animation.
  179. */
  180. export function isElementRemoved(el) {
  181. if (!el.__zr) {
  182. return true;
  183. }
  184. for (var i = 0; i < el.animators.length; i++) {
  185. var animator = el.animators[i];
  186. if (animator.scope === 'leave') {
  187. return true;
  188. }
  189. }
  190. return false;
  191. }
  192. /**
  193. * Remove graphic element
  194. */
  195. export function removeElement(el, props, animatableModel, dataIndex, cb, during) {
  196. // Don't do remove animation twice.
  197. if (isElementRemoved(el)) {
  198. return;
  199. }
  200. animateOrSetProps('leave', el, props, animatableModel, dataIndex, cb, during);
  201. }
  202. function fadeOutDisplayable(el, animatableModel, dataIndex, done) {
  203. el.removeTextContent();
  204. el.removeTextGuideLine();
  205. removeElement(el, {
  206. style: {
  207. opacity: 0
  208. }
  209. }, animatableModel, dataIndex, done);
  210. }
  211. export function removeElementWithFadeOut(el, animatableModel, dataIndex) {
  212. function doRemove() {
  213. el.parent && el.parent.remove(el);
  214. }
  215. // Hide label and labelLine first
  216. // TODO Also use fade out animation?
  217. if (!el.isGroup) {
  218. fadeOutDisplayable(el, animatableModel, dataIndex, doRemove);
  219. } else {
  220. el.traverse(function (disp) {
  221. if (!disp.isGroup) {
  222. // Can invoke doRemove multiple times.
  223. fadeOutDisplayable(disp, animatableModel, dataIndex, doRemove);
  224. }
  225. });
  226. }
  227. }
  228. /**
  229. * Save old style for style transition in universalTransition module.
  230. * It's used when element will be reused in each render.
  231. * For chart like map, heatmap, which will always create new element.
  232. * We don't need to save this because universalTransition can get old style from the old element
  233. */
  234. export function saveOldStyle(el) {
  235. transitionStore(el).oldStyle = el.style;
  236. }
  237. export function getOldStyle(el) {
  238. return transitionStore(el).oldStyle;
  239. }