Skip to content

Commit 19f0de5

Browse files
committed
fix: svgparser creates polygon with no points
1 parent 939cb4a commit 19f0de5

File tree

1 file changed

+47
-111
lines changed

1 file changed

+47
-111
lines changed

main/svgparser.js

Lines changed: 47 additions & 111 deletions
Original file line numberDiff line numberDiff line change
@@ -1096,134 +1096,70 @@ export class SvgParser {
10961096
var path = this.svg.createElementNS('http://www.w3.org/2000/svg', 'path');
10971097
var cx = parseFloat(element.getAttribute('cx')) || 0;
10981098
var cy = parseFloat(element.getAttribute('cy')) || 0;
1099-
var r = parseFloat(element.getAttribute('r')) || 0;
1099+
var r = parseFloat(element.getAttribute('r'));
11001100

1101-
// Create circle path using arc commands
1102-
var d = 'M ' + (cx - r) + ',' + cy +
1103-
' A ' + r + ',' + r + ' 0 1,0 ' + (cx + r) + ',' + cy +
1104-
' A ' + r + ',' + r + ' 0 1,0 ' + (cx - r) + ',' + cy +
1105-
' Z';
1106-
1107-
path.setAttribute('d', d);
1108-
1109-
// Copy other attributes that might be relevant
1110-
if(element.hasAttribute('style')) {
1111-
path.setAttribute('style', element.getAttribute('style'));
1112-
}
1113-
1114-
if(element.hasAttribute('fill')) {
1115-
path.setAttribute('fill', element.getAttribute('fill'));
1116-
}
1117-
1118-
if(element.hasAttribute('stroke')) {
1119-
path.setAttribute('stroke', element.getAttribute('stroke'));
1120-
}
1121-
1122-
if(element.hasAttribute('stroke-width')) {
1123-
path.setAttribute('stroke-width', element.getAttribute('stroke-width'));
1124-
}
1125-
1126-
// Apply the transform to the path instead
1127-
if(transformString) {
1128-
path.setAttribute('transform', transformString);
1101+
if (isNaN(r) || r === 0) {
1102+
console.warn('Degenerate circle encountered and will be removed or ignored:', element);
1103+
if(element.parentNode) element.parentNode.removeChild(element);
1104+
return;
11291105
}
11301106

1131-
// Replace the circle with the path
1132-
element.parentElement.replaceChild(path, element);
1133-
element = path;
1134-
1135-
// Process the path with the existing path transformation code
1136-
this.pathToAbsolute(element);
1137-
var seglist = element.pathSegList;
1138-
var prevx = 0;
1139-
var prevy = 0;
1140-
1141-
for(var i=0; i<seglist.numberOfItems; i++){
1142-
var s = seglist.getItem(i);
1143-
var command = s.pathSegTypeAsLetter;
1144-
1145-
if(command == 'H'){
1146-
seglist.replaceItem(element.createSVGPathSegLinetoAbs(s.x,prevy),i);
1147-
s = seglist.getItem(i);
1148-
}
1149-
else if(command == 'V'){
1150-
seglist.replaceItem(element.createSVGPathSegLinetoAbs(prevx,s.y),i);
1151-
s = seglist.getItem(i);
1152-
}
1153-
else if(command == 'A'){
1154-
var arcrotate = s.angle + rotate;
1155-
var arcsweep = s.sweepFlag;
1156-
1157-
seglist.replaceItem(element.createSVGPathSegArcAbs(s.x,s.y,s.r1*scale,s.r2*scale,arcrotate,s.largeArcFlag,arcsweep),i);
1158-
s = seglist.getItem(i);
1159-
}
1160-
1161-
if('x' in s && 'y' in s){
1162-
var transformed = transform.calc(new Point(s.x, s.y));
1163-
prevx = s.x;
1164-
prevy = s.y;
1107+
// Create a path representing the circle
1108+
// M cx-r,cy A r,r 0 1,0 cx+r,cy A r,r 0 1,0 cx-r,cy Z
1109+
var d = `M ${cx - r},${cy} A ${r},${r} 0 1,0 ${cx + r},${cy} A ${r},${r} 0 1,0 ${cx - r},${cy} Z`;
1110+
path.setAttribute('d', d);
1111+
path.setAttribute('transform', transformString); // Apply the original transform to the new path
11651112

1166-
s.x = transformed.x;
1167-
s.y = transformed.y;
1168-
}
1169-
if('x1' in s && 'y1' in s){
1170-
var transformed = transform.calc(new Point(s.x1, s.y1));
1171-
s.x1 = transformed.x;
1172-
s.y1 = transformed.y;
1173-
}
1174-
if('x2' in s && 'y2' in s){
1175-
var transformed = transform.calc(new Point(s.x2, s.y2));
1176-
s.x2 = transformed.x;
1177-
s.y2 = transformed.y;
1113+
// Copy other relevant attributes
1114+
for (var k = 0; k < element.attributes.length; k++) {
1115+
var attr = element.attributes[k];
1116+
if (attr.name !== 'cx' && attr.name !== 'cy' && attr.name !== 'r' && attr.name !== 'transform') {
1117+
path.setAttribute(attr.name, attr.value);
11781118
}
11791119
}
11801120

1181-
element.removeAttribute('transform');
1182-
break;
1121+
element.parentNode.replaceChild(path, element);
1122+
// After replacing, we need to process this new path with its transform
1123+
this.applyTransform(path, '', skipClosed, dxfFlag);
1124+
break;
11831125

11841126
case 'rect':
11851127
if(skipClosed){
11861128
element.setAttribute('transform', transformString);
11871129
return;
11881130
}
1189-
// similar to the ellipse, we'll replace rect with polygon
1190-
var polygon = this.svg.createElementNS('http://www.w3.org/2000/svg', 'polygon');
1191-
1192-
1193-
var p1 = this.svgRoot.createSVGPoint();
1194-
var p2 = this.svgRoot.createSVGPoint();
1195-
var p3 = this.svgRoot.createSVGPoint();
1196-
var p4 = this.svgRoot.createSVGPoint();
1197-
1198-
p1.x = parseFloat(element.getAttribute('x')) || 0;
1199-
p1.y = parseFloat(element.getAttribute('y')) || 0;
1200-
1201-
p2.x = p1.x + parseFloat(element.getAttribute('width'));
1202-
p2.y = p1.y;
1203-
1204-
p3.x = p2.x;
1205-
p3.y = p1.y + parseFloat(element.getAttribute('height'));
1206-
1207-
p4.x = p1.x;
1208-
p4.y = p3.y;
1209-
1210-
polygon.points.appendItem(p1);
1211-
polygon.points.appendItem(p2);
1212-
polygon.points.appendItem(p3);
1213-
polygon.points.appendItem(p4);
1214-
1215-
// OnShape exports a rectangle at position 0/0, drop it
1216-
if (p1.x === 0 && p1.y === 0) {
1217-
polygon.points.clear();
1131+
var x = parseFloat(element.getAttribute('x')) || 0;
1132+
var y = parseFloat(element.getAttribute('y')) || 0;
1133+
var width = parseFloat(element.getAttribute('width'));
1134+
var height = parseFloat(element.getAttribute('height'));
1135+
1136+
// If width or height is 0 or NaN, this rect is degenerate
1137+
if (isNaN(width) || isNaN(height) || width === 0 || height === 0) {
1138+
console.warn('Degenerate rect encountered and will be removed or ignored:', element);
1139+
// Optionally remove the element if it makes sense for the application
1140+
if(element.parentNode) element.parentNode.removeChild(element);
1141+
return; // Stop processing this element
12181142
}
12191143

1220-
var transformProperty = element.getAttribute('transform');
1221-
if(transformProperty){
1222-
polygon.setAttribute('transform', transformProperty);
1144+
var p1 = transform.calc(x,y);
1145+
var p2 = transform.calc(x+width,y);
1146+
var p3 = transform.calc(x+width,y+height);
1147+
var p4 = transform.calc(x,y+height);
1148+
1149+
var polygon = this.svg.createElementNS('http://www.w3.org/2000/svg', 'polygon');
1150+
polygon.setAttribute('points', p1.x+','+p1.y+' '+p2.x+','+p2.y+' '+p3.x+','+p3.y+' '+p4.x+','+p4.y);
1151+
1152+
// Copy other relevant attributes (like fill, stroke, id, class etc.) from rect to polygon
1153+
for (var k = 0; k < element.attributes.length; k++) {
1154+
var attr = element.attributes[k];
1155+
// Avoid copying attributes that are specific to rect or already handled
1156+
if (attr.name !== 'x' && attr.name !== 'y' && attr.name !== 'width' && attr.name !== 'height' && attr.name !== 'transform') {
1157+
polygon.setAttribute(attr.name, attr.value);
1158+
}
12231159
}
12241160

1225-
element.parentElement.replaceChild(polygon, element);
1226-
element = polygon;
1161+
element.parentNode.replaceChild(polygon, element);
1162+
break;
12271163

12281164
case 'polygon':
12291165
case 'polyline':

0 commit comments

Comments
 (0)