Skip to content

Commit 64d9ca9

Browse files
committed
Fix stroke width calculation
1 parent 33f5901 commit 64d9ca9

File tree

1 file changed

+19
-10
lines changed

1 file changed

+19
-10
lines changed

src/svg-renderer.js

Lines changed: 19 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -305,18 +305,27 @@ class SvgRenderer {
305305
* @return {number} The largest stroke width in the SVG.
306306
*/
307307
_findLargestStrokeWidth (rootNode) {
308+
// Per SVG spec, the 'stroke' attribute only applies to shapes and text content elements:
309+
// https://www.w3.org/TR/SVG11/painting.html#StrokeProperty
310+
const STROKABLE_ELEMENTS = new Set([
311+
// Shape elements (https://www.w3.org/TR/SVG11/intro.html#TermShape)
312+
'path', 'rect', 'circle', 'ellipse', 'line', 'polyline', 'polygon',
313+
// Text content elements (https://www.w3.org/TR/SVG11/intro.html#TermTextContentElement)
314+
'altGlyph', 'textPath', 'text', 'tref', 'tspan'
315+
]);
316+
308317
let largestStrokeWidth = 0;
309318
const collectStrokeWidths = domElement => {
310-
if (domElement.getAttribute) {
311-
if (domElement.getAttribute('stroke')) {
312-
largestStrokeWidth = Math.max(largestStrokeWidth, 1);
313-
}
314-
if (domElement.getAttribute('stroke-width')) {
315-
largestStrokeWidth = Math.max(
316-
largestStrokeWidth,
317-
Number(domElement.getAttribute('stroke-width')) || 0
318-
);
319-
}
319+
if (
320+
STROKABLE_ELEMENTS.has(domElement.localName) &&
321+
domElement.getAttribute &&
322+
domElement.getAttribute('stroke') &&
323+
domElement.getAttribute('stroke') !== 'none'
324+
) {
325+
const strokeWidthAttr = domElement.getAttribute('stroke-width');
326+
// Stroke width is 1 if unset.
327+
const strokeWidth = Number(strokeWidthAttr) || 1;
328+
largestStrokeWidth = Math.max(largestStrokeWidth, strokeWidth);
320329
}
321330
for (let i = 0; i < domElement.childNodes.length; i++) {
322331
collectStrokeWidths(domElement.childNodes[i]);

0 commit comments

Comments
 (0)