build-attrs.mjs 1.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. import { buildHTMLStyles } from '../../html/utils/build-styles.mjs';
  2. import { buildSVGPath } from './path.mjs';
  3. import { calcSVGTransformOrigin } from './transform-origin.mjs';
  4. /**
  5. * Build SVG visual attrbutes, like cx and style.transform
  6. */
  7. function buildSVGAttrs(state, { attrX, attrY, attrScale, originX, originY, pathLength, pathSpacing = 1, pathOffset = 0,
  8. // This is object creation, which we try to avoid per-frame.
  9. ...latest }, isSVGTag, transformTemplate) {
  10. buildHTMLStyles(state, latest, transformTemplate);
  11. /**
  12. * For svg tags we just want to make sure viewBox is animatable and treat all the styles
  13. * as normal HTML tags.
  14. */
  15. if (isSVGTag) {
  16. if (state.style.viewBox) {
  17. state.attrs.viewBox = state.style.viewBox;
  18. }
  19. return;
  20. }
  21. state.attrs = state.style;
  22. state.style = {};
  23. const { attrs, style, dimensions } = state;
  24. /**
  25. * However, we apply transforms as CSS transforms. So if we detect a transform we take it from attrs
  26. * and copy it into style.
  27. */
  28. if (attrs.transform) {
  29. if (dimensions)
  30. style.transform = attrs.transform;
  31. delete attrs.transform;
  32. }
  33. // Parse transformOrigin
  34. if (dimensions &&
  35. (originX !== undefined || originY !== undefined || style.transform)) {
  36. style.transformOrigin = calcSVGTransformOrigin(dimensions, originX !== undefined ? originX : 0.5, originY !== undefined ? originY : 0.5);
  37. }
  38. // Render attrX/attrY/attrScale as attributes
  39. if (attrX !== undefined)
  40. attrs.x = attrX;
  41. if (attrY !== undefined)
  42. attrs.y = attrY;
  43. if (attrScale !== undefined)
  44. attrs.scale = attrScale;
  45. // Build SVG path if one has been defined
  46. if (pathLength !== undefined) {
  47. buildSVGPath(attrs, pathLength, pathSpacing, pathOffset, false);
  48. }
  49. }
  50. export { buildSVGAttrs };