@fluentui/react-charting 5.23.46 → 5.23.48

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,6 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
3
  exports.toImage = void 0;
4
+ var tslib_1 = require("tslib");
4
5
  var d3_selection_1 = require("d3-selection");
5
6
  var index_1 = require("../../utilities/index");
6
7
  function toImage(chartContainer, opts) {
@@ -28,20 +29,31 @@ function toImage(chartContainer, opts) {
28
29
  });
29
30
  }
30
31
  exports.toImage = toImage;
32
+ var SVG_STYLE_PROPERTIES = ['display', 'fill', 'fill-opacity', 'opacity', 'stroke', 'stroke-width', 'transform'];
33
+ var SVG_TEXT_STYLE_PROPERTIES = ['font-family', 'font-size', 'font-weight', 'text-anchor'];
31
34
  function toSVG(chartContainer, background) {
32
35
  var svg = chartContainer.querySelector('svg');
33
36
  if (!svg) {
34
37
  throw new Error('SVG not found');
35
38
  }
36
- var _a = svg.getBoundingClientRect(), svgWidth = _a.width, svgHeight = _a.height;
37
- var classNames = new Set();
38
- var legendGroup = cloneLegendsToSVG(chartContainer, svgWidth, svgHeight, classNames);
39
- var w1 = Math.max(svgWidth, legendGroup.width);
40
- var h1 = svgHeight + legendGroup.height;
41
39
  var clonedSvg = (0, d3_selection_1.select)(svg.cloneNode(true))
42
40
  .attr('width', null)
43
41
  .attr('height', null)
44
42
  .attr('viewBox', null);
43
+ var svgElements = svg.getElementsByTagName('*');
44
+ var clonedSvgElements = clonedSvg.node().getElementsByTagName('*');
45
+ for (var i = 0; i < svgElements.length; i++) {
46
+ if (svgElements[i].tagName.toLowerCase() === 'text') {
47
+ copyStyle(tslib_1.__spreadArray(tslib_1.__spreadArray([], SVG_STYLE_PROPERTIES, true), SVG_TEXT_STYLE_PROPERTIES, true), svgElements[i], clonedSvgElements[i]);
48
+ }
49
+ else {
50
+ copyStyle(SVG_STYLE_PROPERTIES, svgElements[i], clonedSvgElements[i]);
51
+ }
52
+ }
53
+ var _a = svg.getBoundingClientRect(), svgWidth = _a.width, svgHeight = _a.height;
54
+ var legendGroup = cloneLegendsToSVG(chartContainer, svgWidth, svgHeight);
55
+ var w1 = Math.max(svgWidth, legendGroup.width);
56
+ var h1 = svgHeight + legendGroup.height;
45
57
  if (legendGroup.node) {
46
58
  clonedSvg.append(function () { return legendGroup.node; });
47
59
  }
@@ -52,30 +64,6 @@ function toSVG(chartContainer, background) {
52
64
  .attr('width', w1)
53
65
  .attr('height', h1)
54
66
  .attr('fill', background);
55
- var svgElements = svg.getElementsByTagName('*');
56
- var styleSheets = document.styleSheets;
57
- var styleRules = '';
58
- for (var i = svgElements.length - 1; i--;) {
59
- svgElements[i].classList.forEach(function (className) {
60
- classNames.add(".".concat(className));
61
- });
62
- }
63
- for (var i = 0; i < styleSheets.length; i++) {
64
- var rules = styleSheets[i].cssRules;
65
- for (var j = 0; j < rules.length; j++) {
66
- if (rules[j].constructor.name === 'CSSStyleRule') {
67
- var selectorText = rules[j].selectorText;
68
- var hasClassName = selectorText.split(' ').some(function (word) { return classNames.has(word); });
69
- if (hasClassName) {
70
- styleRules += rules[j].cssText + ' ';
71
- }
72
- }
73
- }
74
- }
75
- styleRules = (0, index_1.resolveCSSVariables)(chartContainer, styleRules);
76
- var xmlDocument = new DOMParser().parseFromString('<svg></svg>', 'image/svg+xml');
77
- var styleNode = xmlDocument.createCDATASection(styleRules);
78
- clonedSvg.insert('defs', ':first-child').append('style').attr('type', 'text/css').node().appendChild(styleNode);
79
67
  clonedSvg.attr('width', w1).attr('height', h1).attr('viewBox', "0 0 ".concat(w1, " ").concat(h1));
80
68
  return {
81
69
  node: clonedSvg.node(),
@@ -83,7 +71,18 @@ function toSVG(chartContainer, background) {
83
71
  height: h1,
84
72
  };
85
73
  }
86
- function cloneLegendsToSVG(chartContainer, svgWidth, svgHeight, classNames) {
74
+ var LEGEND_RECT_STYLE_PROPERTIES_MAP = {
75
+ 'background-color': 'fill',
76
+ 'border-color': 'stroke',
77
+ };
78
+ var LEGEND_TEXT_STYLE_PROPERTIES_MAP = {
79
+ color: 'fill',
80
+ 'font-family': 'font-family',
81
+ 'font-size': 'font-size',
82
+ 'font-weight': 'font-weight',
83
+ opacity: 'opacity',
84
+ };
85
+ function cloneLegendsToSVG(chartContainer, svgWidth, svgHeight) {
87
86
  var legendButtons = chartContainer.querySelectorAll("\n button[class^=\"legend-\"],\n [class^=\"legendContainer-\"] div[class^=\"overflowIndicationTextStyle-\"],\n [class^=\"legendsContainer-\"] div[class^=\"overflowIndicationTextStyle-\"]\n ");
88
87
  if (legendButtons.length === 0) {
89
88
  return {
@@ -98,7 +97,7 @@ function cloneLegendsToSVG(chartContainer, svgWidth, svgHeight, classNames) {
98
97
  var legendLine = [];
99
98
  var legendLines = [];
100
99
  var legendLineWidths = [];
101
- for (var i = 0; i < legendButtons.length; i++) {
100
+ var _loop_1 = function (i) {
102
101
  var legendWidth = legendButtons[i].getBoundingClientRect().width;
103
102
  var legendItem = legendGroup.append('g');
104
103
  legendLine.push(legendItem);
@@ -110,39 +109,36 @@ function cloneLegendsToSVG(chartContainer, svgWidth, svgHeight, classNames) {
110
109
  legendX = 0;
111
110
  legendY += 32;
112
111
  }
113
- var legendText = void 0;
112
+ var legendText;
114
113
  var textOffset = 0;
115
114
  if (legendButtons[i].tagName.toLowerCase() === 'button') {
116
- var legendRect = legendButtons[i].querySelector('[class^="rect"]');
117
- var _a = getComputedStyle(legendRect), legendColor = _a.backgroundColor, legendBorderColor = _a.borderColor;
115
+ var legendRect_1 = legendButtons[i].querySelector('[class^="rect"]');
118
116
  legendText = legendButtons[i].querySelector('[class^="text"]');
119
- legendText.classList.forEach(function (className) { return classNames.add(".".concat(className)); });
120
117
  legendItem
121
118
  .append('rect')
122
119
  .attr('x', legendX + 8)
123
120
  .attr('y', svgHeight + legendY + 8)
124
121
  .attr('width', 12)
125
122
  .attr('height', 12)
126
- .attr('fill', legendColor)
127
123
  .attr('stroke-width', 1)
128
- .attr('stroke', legendBorderColor);
124
+ .call(function (selection) { return copyStyle(LEGEND_RECT_STYLE_PROPERTIES_MAP, legendRect_1, selection.node()); });
129
125
  textOffset = 28;
130
126
  }
131
127
  else {
132
128
  legendText = legendButtons[i];
133
- legendText.classList.forEach(function (className) { return classNames.add(".".concat(className)); });
134
129
  textOffset = 8;
135
130
  }
136
- var textColor = getComputedStyle(legendText).color;
137
131
  legendItem
138
132
  .append('text')
139
133
  .attr('x', legendX + textOffset)
140
134
  .attr('y', svgHeight + legendY + 8)
141
135
  .attr('dominant-baseline', 'hanging')
142
- .attr('class', legendText.getAttribute('class'))
143
- .attr('fill', textColor)
144
- .text(legendText.textContent);
136
+ .text(legendText.textContent)
137
+ .call(function (selection) { return copyStyle(LEGEND_TEXT_STYLE_PROPERTIES_MAP, legendText, selection.node()); });
145
138
  legendX += legendWidth;
139
+ };
140
+ for (var i = 0; i < legendButtons.length; i++) {
141
+ _loop_1(i);
146
142
  }
147
143
  legendLines.push(legendLine);
148
144
  legendLineWidths.push(legendX);
@@ -227,4 +223,18 @@ function unescapePonyfill(str) {
227
223
  }
228
224
  return result;
229
225
  }
226
+ function copyStyle(properties, fromEl, toEl) {
227
+ var styles = getComputedStyle(fromEl);
228
+ if (Array.isArray(properties)) {
229
+ properties.forEach(function (prop) {
230
+ (0, d3_selection_1.select)(toEl).style(prop, styles.getPropertyValue(prop));
231
+ });
232
+ }
233
+ else {
234
+ Object.entries(properties).forEach(function (_a) {
235
+ var fromProp = _a[0], toProp = _a[1];
236
+ (0, d3_selection_1.select)(toEl).style(toProp, styles.getPropertyValue(fromProp));
237
+ });
238
+ }
239
+ }
230
240
  //# sourceMappingURL=imageExporter.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"imageExporter.js","sourceRoot":"../src/","sources":["components/DeclarativeChart/imageExporter.ts"],"names":[],"mappings":"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","sourcesContent":["import { create as d3Create, select as d3Select, Selection } from 'd3-selection';\nimport { resolveCSSVariables } from '../../utilities/index';\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IImageExportOptions {\n width?: number;\n height?: number;\n scale?: number;\n background?: string;\n}\n\nexport function toImage(chartContainer?: HTMLElement | null, opts: IImageExportOptions = {}): Promise<string> {\n return new Promise((resolve, reject) => {\n if (!chartContainer) {\n return reject(new Error('Chart container is not defined'));\n }\n\n try {\n const background =\n typeof opts.background === 'string' ? resolveCSSVariables(chartContainer, opts.background) : 'transparent';\n const svg = toSVG(chartContainer, background);\n\n const svgData = new XMLSerializer().serializeToString(svg.node);\n const svgDataUrl = 'data:image/svg+xml;base64,' + btoa(unescapePonyfill(encodeURIComponent(svgData)));\n\n svgToPng(svgDataUrl, {\n width: opts.width || svg.width,\n height: opts.height || svg.height,\n scale: opts.scale,\n })\n .then(resolve)\n .catch(reject);\n } catch (err) {\n return reject(err);\n }\n });\n}\n\nfunction toSVG(chartContainer: HTMLElement, background: string) {\n const svg = chartContainer.querySelector<SVGSVGElement>('svg');\n if (!svg) {\n throw new Error('SVG not found');\n }\n\n const { width: svgWidth, height: svgHeight } = svg.getBoundingClientRect();\n const classNames = new Set<string>();\n const legendGroup = cloneLegendsToSVG(chartContainer, svgWidth, svgHeight, classNames);\n const w1 = Math.max(svgWidth, legendGroup.width);\n const h1 = svgHeight + legendGroup.height;\n const clonedSvg = d3Select(svg.cloneNode(true) as SVGSVGElement)\n .attr('width', null)\n .attr('height', null)\n .attr('viewBox', null);\n\n if (legendGroup.node) {\n clonedSvg.append(() => legendGroup.node);\n }\n clonedSvg\n .insert('rect', ':first-child')\n .attr('x', 0)\n .attr('y', 0)\n .attr('width', w1)\n .attr('height', h1)\n .attr('fill', background);\n\n const svgElements = svg.getElementsByTagName('*');\n const styleSheets = document.styleSheets;\n let styleRules: string = '';\n\n for (let i = svgElements.length - 1; i--; ) {\n svgElements[i].classList.forEach(className => {\n classNames.add(`.${className}`);\n });\n }\n\n for (let i = 0; i < styleSheets.length; i++) {\n const rules = styleSheets[i].cssRules;\n for (let j = 0; j < rules.length; j++) {\n if (rules[j].constructor.name === 'CSSStyleRule') {\n const selectorText = (rules[j] as CSSStyleRule).selectorText;\n const hasClassName = selectorText.split(' ').some(word => classNames.has(word));\n\n if (hasClassName) {\n styleRules += rules[j].cssText + ' ';\n }\n }\n }\n }\n styleRules = resolveCSSVariables(chartContainer, styleRules);\n\n const xmlDocument = new DOMParser().parseFromString('<svg></svg>', 'image/svg+xml');\n const styleNode = xmlDocument.createCDATASection(styleRules);\n clonedSvg.insert('defs', ':first-child').append('style').attr('type', 'text/css').node()!.appendChild(styleNode);\n\n clonedSvg.attr('width', w1).attr('height', h1).attr('viewBox', `0 0 ${w1} ${h1}`);\n\n return {\n node: clonedSvg.node()!,\n width: w1,\n height: h1,\n };\n}\n\nfunction cloneLegendsToSVG(chartContainer: HTMLElement, svgWidth: number, svgHeight: number, classNames: Set<string>) {\n const legendButtons = chartContainer.querySelectorAll<HTMLElement>(`\n button[class^=\"legend-\"],\n [class^=\"legendContainer-\"] div[class^=\"overflowIndicationTextStyle-\"],\n [class^=\"legendsContainer-\"] div[class^=\"overflowIndicationTextStyle-\"]\n `);\n if (legendButtons.length === 0) {\n return {\n node: null,\n width: 0,\n height: 0,\n };\n }\n\n const legendGroup = d3Create<SVGGElement>('svg:g');\n let legendX = 0;\n let legendY = 8;\n let legendLine: Selection<SVGGElement, unknown, null, undefined>[] = [];\n const legendLines: (typeof legendLine)[] = [];\n const legendLineWidths: number[] = [];\n\n for (let i = 0; i < legendButtons.length; i++) {\n const { width: legendWidth } = legendButtons[i].getBoundingClientRect();\n const legendItem = legendGroup.append('g');\n\n legendLine.push(legendItem);\n if (legendX + legendWidth > svgWidth && legendLine.length > 1) {\n legendLine.pop();\n legendLines.push(legendLine);\n legendLineWidths.push(legendX);\n\n legendLine = [legendItem];\n legendX = 0;\n legendY += 32;\n }\n\n let legendText: HTMLDivElement | null;\n let textOffset = 0;\n\n if (legendButtons[i].tagName.toLowerCase() === 'button') {\n const legendRect = legendButtons[i].querySelector<HTMLDivElement>('[class^=\"rect\"]');\n const { backgroundColor: legendColor, borderColor: legendBorderColor } = getComputedStyle(legendRect!);\n\n legendText = legendButtons[i].querySelector<HTMLDivElement>('[class^=\"text\"]');\n legendText!.classList.forEach(className => classNames.add(`.${className}`));\n legendItem\n .append('rect')\n .attr('x', legendX + 8)\n .attr('y', svgHeight + legendY + 8)\n .attr('width', 12)\n .attr('height', 12)\n .attr('fill', legendColor)\n .attr('stroke-width', 1)\n .attr('stroke', legendBorderColor);\n textOffset = 28;\n } else {\n legendText = legendButtons[i] as HTMLDivElement;\n legendText.classList.forEach(className => classNames.add(`.${className}`));\n textOffset = 8;\n }\n\n const { color: textColor } = getComputedStyle(legendText!);\n legendItem\n .append('text')\n .attr('x', legendX + textOffset)\n .attr('y', svgHeight + legendY + 8)\n .attr('dominant-baseline', 'hanging')\n .attr('class', legendText!.getAttribute('class'))\n .attr('fill', textColor)\n .text(legendText!.textContent);\n legendX += legendWidth;\n }\n\n legendLines.push(legendLine);\n legendLineWidths.push(legendX);\n legendY += 32;\n\n const centerLegends = true;\n if (centerLegends) {\n legendLines.forEach((ln, idx) => {\n const offsetX = Math.max((svgWidth - legendLineWidths[idx]) / 2, 0);\n ln.forEach(item => {\n item.attr('transform', `translate(${offsetX}, 0)`);\n });\n });\n }\n\n return {\n node: legendGroup.node(),\n width: Math.max(...legendLineWidths),\n height: legendY,\n };\n}\n\nfunction svgToPng(svgDataUrl: string, opts: IImageExportOptions = {}): Promise<string> {\n return new Promise((resolve, reject) => {\n const scale = opts.scale || 1;\n const w0 = opts.width || 300;\n const h0 = opts.height || 150;\n const w1 = scale * w0;\n const h1 = scale * h0;\n\n const canvas = document.createElement('canvas');\n const img = new Image();\n\n canvas.width = w1;\n canvas.height = h1;\n\n img.onload = function () {\n const ctx = canvas.getContext('2d');\n if (!ctx) {\n return reject(new Error('Canvas context is null'));\n }\n\n ctx.clearRect(0, 0, w1, h1);\n ctx.drawImage(img, 0, 0, w1, h1);\n\n const imgData = canvas.toDataURL('image/png');\n resolve(imgData);\n };\n\n img.onerror = function (err) {\n reject(err);\n };\n\n img.src = svgDataUrl;\n });\n}\n\nconst hex2 = /^[\\da-f]{2}$/i;\nconst hex4 = /^[\\da-f]{4}$/i;\n\n/**\n * A ponyfill for the deprecated `unescape` method, taken from the `core-js` library.\n *\n * Source: {@link https://github.com/zloirock/core-js/blob/167136f479d3b8519953f2e4c534ecdd1031d3cf/packages/core-js/modules/es.unescape.js core-js/packages/core-js/modules/es.unescape.js}\n */\nfunction unescapePonyfill(str: string) {\n let result = '';\n const length = str.length;\n let index = 0;\n let chr;\n let part;\n while (index < length) {\n chr = str.charAt(index++);\n if (chr === '%') {\n if (str.charAt(index) === 'u') {\n part = str.slice(index + 1, index + 5);\n if (hex4.exec(part)) {\n result += String.fromCharCode(parseInt(part, 16));\n index += 5;\n continue;\n }\n } else {\n part = str.slice(index, index + 2);\n if (hex2.exec(part)) {\n result += String.fromCharCode(parseInt(part, 16));\n index += 2;\n continue;\n }\n }\n }\n result += chr;\n }\n return result;\n}\n"]}
1
+ {"version":3,"file":"imageExporter.js","sourceRoot":"../src/","sources":["components/DeclarativeChart/imageExporter.ts"],"names":[],"mappings":"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","sourcesContent":["import { create as d3Create, select as d3Select, Selection } from 'd3-selection';\nimport { resolveCSSVariables } from '../../utilities/index';\n\n/**\n * {@docCategory DeclarativeChart}\n */\nexport interface IImageExportOptions {\n width?: number;\n height?: number;\n scale?: number;\n background?: string;\n}\n\nexport function toImage(chartContainer?: HTMLElement | null, opts: IImageExportOptions = {}): Promise<string> {\n return new Promise((resolve, reject) => {\n if (!chartContainer) {\n return reject(new Error('Chart container is not defined'));\n }\n\n try {\n const background =\n typeof opts.background === 'string' ? resolveCSSVariables(chartContainer, opts.background) : 'transparent';\n const svg = toSVG(chartContainer, background);\n\n const svgData = new XMLSerializer().serializeToString(svg.node);\n const svgDataUrl = 'data:image/svg+xml;base64,' + btoa(unescapePonyfill(encodeURIComponent(svgData)));\n\n svgToPng(svgDataUrl, {\n width: opts.width || svg.width,\n height: opts.height || svg.height,\n scale: opts.scale,\n })\n .then(resolve)\n .catch(reject);\n } catch (err) {\n return reject(err);\n }\n });\n}\n\nconst SVG_STYLE_PROPERTIES = ['display', 'fill', 'fill-opacity', 'opacity', 'stroke', 'stroke-width', 'transform'];\nconst SVG_TEXT_STYLE_PROPERTIES = ['font-family', 'font-size', 'font-weight', 'text-anchor'];\n\nfunction toSVG(chartContainer: HTMLElement, background: string) {\n const svg = chartContainer.querySelector<SVGSVGElement>('svg');\n if (!svg) {\n throw new Error('SVG not found');\n }\n\n const clonedSvg = d3Select(svg.cloneNode(true) as SVGSVGElement)\n .attr('width', null)\n .attr('height', null)\n .attr('viewBox', null);\n const svgElements = svg.getElementsByTagName('*');\n const clonedSvgElements = clonedSvg.node()!.getElementsByTagName('*');\n\n for (let i = 0; i < svgElements.length; i++) {\n if (svgElements[i].tagName.toLowerCase() === 'text') {\n copyStyle([...SVG_STYLE_PROPERTIES, ...SVG_TEXT_STYLE_PROPERTIES], svgElements[i], clonedSvgElements[i]);\n } else {\n copyStyle(SVG_STYLE_PROPERTIES, svgElements[i], clonedSvgElements[i]);\n }\n }\n\n const { width: svgWidth, height: svgHeight } = svg.getBoundingClientRect();\n const legendGroup = cloneLegendsToSVG(chartContainer, svgWidth, svgHeight);\n const w1 = Math.max(svgWidth, legendGroup.width);\n const h1 = svgHeight + legendGroup.height;\n\n if (legendGroup.node) {\n clonedSvg.append(() => legendGroup.node);\n }\n clonedSvg\n .insert('rect', ':first-child')\n .attr('x', 0)\n .attr('y', 0)\n .attr('width', w1)\n .attr('height', h1)\n .attr('fill', background);\n clonedSvg.attr('width', w1).attr('height', h1).attr('viewBox', `0 0 ${w1} ${h1}`);\n\n return {\n node: clonedSvg.node()!,\n width: w1,\n height: h1,\n };\n}\n\nconst LEGEND_RECT_STYLE_PROPERTIES_MAP = {\n 'background-color': 'fill',\n 'border-color': 'stroke',\n};\nconst LEGEND_TEXT_STYLE_PROPERTIES_MAP = {\n color: 'fill',\n 'font-family': 'font-family',\n 'font-size': 'font-size',\n 'font-weight': 'font-weight',\n opacity: 'opacity',\n};\n\nfunction cloneLegendsToSVG(chartContainer: HTMLElement, svgWidth: number, svgHeight: number) {\n const legendButtons = chartContainer.querySelectorAll<HTMLElement>(`\n button[class^=\"legend-\"],\n [class^=\"legendContainer-\"] div[class^=\"overflowIndicationTextStyle-\"],\n [class^=\"legendsContainer-\"] div[class^=\"overflowIndicationTextStyle-\"]\n `);\n if (legendButtons.length === 0) {\n return {\n node: null,\n width: 0,\n height: 0,\n };\n }\n\n const legendGroup = d3Create<SVGGElement>('svg:g');\n let legendX = 0;\n let legendY = 8;\n let legendLine: Selection<SVGGElement, unknown, null, undefined>[] = [];\n const legendLines: (typeof legendLine)[] = [];\n const legendLineWidths: number[] = [];\n\n for (let i = 0; i < legendButtons.length; i++) {\n const { width: legendWidth } = legendButtons[i].getBoundingClientRect();\n const legendItem = legendGroup.append('g');\n\n legendLine.push(legendItem);\n if (legendX + legendWidth > svgWidth && legendLine.length > 1) {\n legendLine.pop();\n legendLines.push(legendLine);\n legendLineWidths.push(legendX);\n\n legendLine = [legendItem];\n legendX = 0;\n legendY += 32;\n }\n\n let legendText: HTMLDivElement | null;\n let textOffset = 0;\n\n if (legendButtons[i].tagName.toLowerCase() === 'button') {\n const legendRect = legendButtons[i].querySelector<HTMLDivElement>('[class^=\"rect\"]');\n\n legendText = legendButtons[i].querySelector<HTMLDivElement>('[class^=\"text\"]');\n legendItem\n .append('rect')\n .attr('x', legendX + 8)\n .attr('y', svgHeight + legendY + 8)\n .attr('width', 12)\n .attr('height', 12)\n .attr('stroke-width', 1)\n .call(selection => copyStyle(LEGEND_RECT_STYLE_PROPERTIES_MAP, legendRect!, selection.node()!));\n textOffset = 28;\n } else {\n legendText = legendButtons[i] as HTMLDivElement;\n textOffset = 8;\n }\n\n legendItem\n .append('text')\n .attr('x', legendX + textOffset)\n .attr('y', svgHeight + legendY + 8)\n .attr('dominant-baseline', 'hanging')\n .text(legendText!.textContent)\n .call(selection => copyStyle(LEGEND_TEXT_STYLE_PROPERTIES_MAP, legendText!, selection.node()!));\n legendX += legendWidth;\n }\n\n legendLines.push(legendLine);\n legendLineWidths.push(legendX);\n legendY += 32;\n\n const centerLegends = true;\n if (centerLegends) {\n legendLines.forEach((ln, idx) => {\n const offsetX = Math.max((svgWidth - legendLineWidths[idx]) / 2, 0);\n ln.forEach(item => {\n item.attr('transform', `translate(${offsetX}, 0)`);\n });\n });\n }\n\n return {\n node: legendGroup.node(),\n width: Math.max(...legendLineWidths),\n height: legendY,\n };\n}\n\nfunction svgToPng(svgDataUrl: string, opts: IImageExportOptions = {}): Promise<string> {\n return new Promise((resolve, reject) => {\n const scale = opts.scale || 1;\n const w0 = opts.width || 300;\n const h0 = opts.height || 150;\n const w1 = scale * w0;\n const h1 = scale * h0;\n\n const canvas = document.createElement('canvas');\n const img = new Image();\n\n canvas.width = w1;\n canvas.height = h1;\n\n img.onload = function () {\n const ctx = canvas.getContext('2d');\n if (!ctx) {\n return reject(new Error('Canvas context is null'));\n }\n\n ctx.clearRect(0, 0, w1, h1);\n ctx.drawImage(img, 0, 0, w1, h1);\n\n const imgData = canvas.toDataURL('image/png');\n resolve(imgData);\n };\n\n img.onerror = function (err) {\n reject(err);\n };\n\n img.src = svgDataUrl;\n });\n}\n\nconst hex2 = /^[\\da-f]{2}$/i;\nconst hex4 = /^[\\da-f]{4}$/i;\n\n/**\n * A ponyfill for the deprecated `unescape` method, taken from the `core-js` library.\n *\n * Source: {@link https://github.com/zloirock/core-js/blob/167136f479d3b8519953f2e4c534ecdd1031d3cf/packages/core-js/modules/es.unescape.js core-js/packages/core-js/modules/es.unescape.js}\n */\nfunction unescapePonyfill(str: string) {\n let result = '';\n const length = str.length;\n let index = 0;\n let chr;\n let part;\n while (index < length) {\n chr = str.charAt(index++);\n if (chr === '%') {\n if (str.charAt(index) === 'u') {\n part = str.slice(index + 1, index + 5);\n if (hex4.exec(part)) {\n result += String.fromCharCode(parseInt(part, 16));\n index += 5;\n continue;\n }\n } else {\n part = str.slice(index, index + 2);\n if (hex2.exec(part)) {\n result += String.fromCharCode(parseInt(part, 16));\n index += 2;\n continue;\n }\n }\n }\n result += chr;\n }\n return result;\n}\n\nfunction copyStyle(properties: string[] | Record<string, string>, fromEl: Element, toEl: Element) {\n const styles = getComputedStyle(fromEl);\n if (Array.isArray(properties)) {\n properties.forEach(prop => {\n d3Select(toEl).style(prop, styles.getPropertyValue(prop));\n });\n } else {\n Object.entries(properties).forEach(([fromProp, toProp]) => {\n d3Select(toEl).style(toProp, styles.getPropertyValue(fromProp));\n });\n }\n}\n"]}
@@ -634,7 +634,7 @@ var VerticalBarChartBase = /** @class */ (function (_super) {
634
634
  _this._points[index].color = startColor;
635
635
  }
636
636
  var gradientId = (0, Utilities_1.getId)('VBC_Gradient') + "_".concat(index, "_").concat(startColor);
637
- return (React.createElement("g", { key: point.x },
637
+ return (React.createElement("g", { key: "".concat(point.x, "_").concat(index) },
638
638
  _this.props.enableGradient && (React.createElement("defs", null,
639
639
  React.createElement("linearGradient", { id: gradientId, x1: "0%", y1: "100%", x2: "0%", y2: "0%" },
640
640
  React.createElement("stop", { offset: "0", stopColor: startColor }),
@@ -711,7 +711,7 @@ var VerticalBarChartBase = /** @class */ (function (_super) {
711
711
  _this._points[index].color = startColor;
712
712
  }
713
713
  var gradientId = (0, Utilities_1.getId)('VBC_Gradient') + "_".concat(index, "_").concat(startColor);
714
- return (React.createElement("g", { key: point.x instanceof Date ? point.x.getTime() : point.x, transform: "translate(".concat(0.5 * (xBarScale.bandwidth() - _this._barWidth), ", 0)") },
714
+ return (React.createElement("g", { key: point.x instanceof Date ? "".concat(point.x.getTime(), "_").concat(index) : "".concat(point.x, "_").concat(index), transform: "translate(".concat(0.5 * (xBarScale.bandwidth() - _this._barWidth), ", 0)") },
715
715
  _this.props.enableGradient && (React.createElement("defs", null,
716
716
  React.createElement("linearGradient", { id: gradientId, x1: "0%", y1: "100%", x2: "0%", y2: "0%" },
717
717
  React.createElement("stop", { offset: "0", stopColor: startColor }),
@@ -792,7 +792,7 @@ var VerticalBarChartBase = /** @class */ (function (_super) {
792
792
  _this._points[index].color = startColor;
793
793
  }
794
794
  var gradientId = (0, Utilities_1.getId)('VBC_Gradient') + "_".concat(index, "_").concat(startColor);
795
- return (React.createElement("g", { key: point.x instanceof Date ? point.x.getTime() : point.x },
795
+ return (React.createElement("g", { key: point.x instanceof Date ? "".concat(point.x.getTime(), "_").concat(index) : "".concat(point.x, "_").concat(index) },
796
796
  _this.props.enableGradient && (React.createElement("defs", null,
797
797
  React.createElement("linearGradient", { id: gradientId, x1: "0%", y1: "100%", x2: "0%", y2: "0%" },
798
798
  React.createElement("stop", { offset: "0", stopColor: startColor }),