SVGRenderer.js 2.8 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182
  1. import {
  2. createElementID,
  3. } from '../utils/common';
  4. import {
  5. extendPrototype,
  6. } from '../utils/functionExtensions';
  7. import createNS from '../utils/helpers/svg_elements';
  8. import SVGCompElement from '../elements/svgElements/SVGCompElement';
  9. import SVGRendererBase from './SVGRendererBase';
  10. function SVGRenderer(animationItem, config) {
  11. this.animationItem = animationItem;
  12. this.layers = null;
  13. this.renderedFrame = -1;
  14. this.svgElement = createNS('svg');
  15. var ariaLabel = '';
  16. if (config && config.title) {
  17. var titleElement = createNS('title');
  18. var titleId = createElementID();
  19. titleElement.setAttribute('id', titleId);
  20. titleElement.textContent = config.title;
  21. this.svgElement.appendChild(titleElement);
  22. ariaLabel += titleId;
  23. }
  24. if (config && config.description) {
  25. var descElement = createNS('desc');
  26. var descId = createElementID();
  27. descElement.setAttribute('id', descId);
  28. descElement.textContent = config.description;
  29. this.svgElement.appendChild(descElement);
  30. ariaLabel += ' ' + descId;
  31. }
  32. if (ariaLabel) {
  33. this.svgElement.setAttribute('aria-labelledby', ariaLabel);
  34. }
  35. var defs = createNS('defs');
  36. this.svgElement.appendChild(defs);
  37. var maskElement = createNS('g');
  38. this.svgElement.appendChild(maskElement);
  39. this.layerElement = maskElement;
  40. this.renderConfig = {
  41. preserveAspectRatio: (config && config.preserveAspectRatio) || 'xMidYMid meet',
  42. imagePreserveAspectRatio: (config && config.imagePreserveAspectRatio) || 'xMidYMid slice',
  43. contentVisibility: (config && config.contentVisibility) || 'visible',
  44. progressiveLoad: (config && config.progressiveLoad) || false,
  45. hideOnTransparent: !((config && config.hideOnTransparent === false)),
  46. viewBoxOnly: (config && config.viewBoxOnly) || false,
  47. viewBoxSize: (config && config.viewBoxSize) || false,
  48. className: (config && config.className) || '',
  49. id: (config && config.id) || '',
  50. focusable: config && config.focusable,
  51. filterSize: {
  52. width: (config && config.filterSize && config.filterSize.width) || '100%',
  53. height: (config && config.filterSize && config.filterSize.height) || '100%',
  54. x: (config && config.filterSize && config.filterSize.x) || '0%',
  55. y: (config && config.filterSize && config.filterSize.y) || '0%',
  56. },
  57. width: (config && config.width),
  58. height: (config && config.height),
  59. runExpressions: !config || config.runExpressions === undefined || config.runExpressions,
  60. };
  61. this.globalData = {
  62. _mdf: false,
  63. frameNum: -1,
  64. defs: defs,
  65. renderConfig: this.renderConfig,
  66. };
  67. this.elements = [];
  68. this.pendingElements = [];
  69. this.destroyed = false;
  70. this.rendererType = 'svg';
  71. }
  72. extendPrototype([SVGRendererBase], SVGRenderer);
  73. SVGRenderer.prototype.createComp = function (data) {
  74. return new SVGCompElement(data, this.globalData, this);
  75. };
  76. export default SVGRenderer;