@jscad/svg-deserializer 2.5.5 → 3.0.0-alpha.0
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.
- package/CHANGELOG.md +12 -201
- package/README.md +5 -1
- package/dist/jscad-svg-deserializer.es.js +38 -0
- package/dist/jscad-svg-deserializer.min.js +38 -0
- package/package.json +23 -12
- package/rollup.config.js +29 -0
- package/src/constants.js +6 -15
- package/src/helpers.js +11 -24
- package/src/index.js +23 -34
- package/src/shapesMapGeometry.js +36 -38
- package/src/shapesMapJscad.js +37 -39
- package/src/svgElementHelpers.js +16 -31
- package/tests/inkscape.test.js +5 -7
- package/tests/instantiate.test.js +102 -83
- package/tests/issue.1135.test.js +5 -5
- package/tests/issue.885.test.js +5 -9
- package/tests/translate.test.js +56 -60
package/src/shapesMapJscad.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
|
|
1
|
+
import { svg2cag, cagLengthX, cagLengthY, cagLengthP, reflect } from './helpers.js'
|
|
2
2
|
|
|
3
|
-
const
|
|
3
|
+
export const shapesMapJscad = (obj, codify, params) => {
|
|
4
4
|
const { level, indent, on, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, svgGroups, target, segments } = params
|
|
5
5
|
|
|
6
6
|
const types = {
|
|
@@ -22,12 +22,12 @@ const shapesMap = (obj, codify, params) => {
|
|
|
22
22
|
x = (x + (w / 2)).toFixed(4) // position the object via the center
|
|
23
23
|
y = (y - (h / 2)).toFixed(4) // position the object via the center
|
|
24
24
|
if (rx === 0) {
|
|
25
|
-
code = `${indent}${on} =
|
|
25
|
+
code = `${indent}${on} = rectangle({center: [${x}, ${y}], size: [${w}, ${h}]}) // line ${obj.position}\n`
|
|
26
26
|
} else {
|
|
27
|
-
code = `${indent}${on} =
|
|
27
|
+
code = `${indent}${on} = roundedRectangle({center: [${x}, ${y}], segments: ${segments}, size: [${w}, ${h}], roundRadius: ${rx}}) // line ${obj.position}\n`
|
|
28
28
|
}
|
|
29
29
|
if (target === 'path') {
|
|
30
|
-
code += `${indent}${on} =
|
|
30
|
+
code += `${indent}${on} = path2.fromPoints({closed: true}, geom2.toPoints(${on}))\n`
|
|
31
31
|
}
|
|
32
32
|
}
|
|
33
33
|
return code
|
|
@@ -39,9 +39,9 @@ const shapesMap = (obj, codify, params) => {
|
|
|
39
39
|
const r = cagLengthP(obj.radius, svgUnitsPmm, svgUnitsV)
|
|
40
40
|
let code
|
|
41
41
|
if (r > 0) {
|
|
42
|
-
code = `${indent}${on} =
|
|
42
|
+
code = `${indent}${on} = circle({center: [${x}, ${y}], segments: ${segments}, radius: ${r}}) // line ${obj.position}\n`
|
|
43
43
|
if (target === 'path') {
|
|
44
|
-
code += `${indent}${on} =
|
|
44
|
+
code += `${indent}${on} = path2.fromPoints({closed: true}, geom2.toPoints(${on}))\n`
|
|
45
45
|
}
|
|
46
46
|
}
|
|
47
47
|
return code
|
|
@@ -54,9 +54,9 @@ const shapesMap = (obj, codify, params) => {
|
|
|
54
54
|
const cy = (0 - cagLengthY(obj.cy, svgUnitsPmm, svgUnitsY))
|
|
55
55
|
let code
|
|
56
56
|
if (rx > 0 && ry > 0) {
|
|
57
|
-
code = `${indent}${on} =
|
|
57
|
+
code = `${indent}${on} = ellipse({center: [${cx}, ${cy}], segments: ${segments}, radius: [${rx}, ${ry}]}) // line ${obj.position}\n`
|
|
58
58
|
if (target === 'path') {
|
|
59
|
-
code += `${indent}${on} =
|
|
59
|
+
code += `${indent}${on} = path2.fromPoints({closed: true}, geom2.toPoints(${on}))\n`
|
|
60
60
|
}
|
|
61
61
|
}
|
|
62
62
|
return code
|
|
@@ -67,7 +67,7 @@ const shapesMap = (obj, codify, params) => {
|
|
|
67
67
|
const y1 = (0 - cagLengthY(obj.y1, svgUnitsPmm, svgUnitsY))
|
|
68
68
|
const x2 = cagLengthX(obj.x2, svgUnitsPmm, svgUnitsX)
|
|
69
69
|
const y2 = (0 - cagLengthY(obj.y2, svgUnitsPmm, svgUnitsY))
|
|
70
|
-
const code = `${indent}${on} =
|
|
70
|
+
const code = `${indent}${on} = line([[${x1}, ${y1}], [${x2}, ${y2}]]) // line ${obj.position}\n`
|
|
71
71
|
if (target === 'geom2') {
|
|
72
72
|
// TODO expand the line to 2D geom
|
|
73
73
|
// const r = getStrokeWidth(obj, svgUnitsPmm, svgUnitsV, svgGroups)
|
|
@@ -76,7 +76,7 @@ const shapesMap = (obj, codify, params) => {
|
|
|
76
76
|
},
|
|
77
77
|
|
|
78
78
|
polygon: (obj, svgUnitsPmm, svgUnitsX, svgUnitsY) => {
|
|
79
|
-
let code = `${indent}${on} =
|
|
79
|
+
let code = `${indent}${on} = polygon({points: [\n`
|
|
80
80
|
for (let j = 0; j < obj.points.length; j++) {
|
|
81
81
|
const p = obj.points[j]
|
|
82
82
|
if ('x' in p && 'y' in p) {
|
|
@@ -87,13 +87,13 @@ const shapesMap = (obj, codify, params) => {
|
|
|
87
87
|
}
|
|
88
88
|
code += `${indent}]}) // line ${obj.position}\n`
|
|
89
89
|
if (target === 'path') {
|
|
90
|
-
code += `${indent}${on} =
|
|
90
|
+
code += `${indent}${on} = path2.fromPoints({closed: true}, geom2.toPoints(${on}))\n`
|
|
91
91
|
}
|
|
92
92
|
return code
|
|
93
93
|
},
|
|
94
94
|
|
|
95
95
|
polyline: (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV) => {
|
|
96
|
-
let code = `${indent}${on} =
|
|
96
|
+
let code = `${indent}${on} = path2.fromPoints({}, [\n`
|
|
97
97
|
for (let j = 0; j < obj.points.length; j++) {
|
|
98
98
|
const p = obj.points[j]
|
|
99
99
|
if ('x' in p && 'y' in p) {
|
|
@@ -116,8 +116,6 @@ const shapesMap = (obj, codify, params) => {
|
|
|
116
116
|
return types[obj.type](obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGroups, segments)
|
|
117
117
|
}
|
|
118
118
|
|
|
119
|
-
module.exports = shapesMap
|
|
120
|
-
|
|
121
119
|
// const getStrokeWidth = (obj, svgUnitsPmm, svgUnitsV, svgGroups) => {
|
|
122
120
|
// let r = cssPxUnit // default
|
|
123
121
|
// if ('strokeWidth' in obj) {
|
|
@@ -151,7 +149,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
151
149
|
for (let j = 0; j < obj.commands.length; j++) {
|
|
152
150
|
const co = obj.commands[j]
|
|
153
151
|
const pts = co.p
|
|
154
|
-
// console.log('
|
|
152
|
+
// console.log('position: ['+cx+','+cy+'] before '+co.c)
|
|
155
153
|
switch (co.c) {
|
|
156
154
|
case 'm': // relative move to X,Y
|
|
157
155
|
// special case, if at beginning of path then treat like absolute M
|
|
@@ -169,14 +167,14 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
169
167
|
pi++
|
|
170
168
|
pc = false
|
|
171
169
|
pathName = on + pi
|
|
172
|
-
tmpCode += `${indent}${pathName} =
|
|
170
|
+
tmpCode += `${indent}${pathName} = path2.fromPoints({}, [[${svg2cag([cx, cy], svgUnitsPmm)}]])\n`
|
|
173
171
|
sx = cx; sy = cy
|
|
174
172
|
}
|
|
175
173
|
// optional implicit relative lineTo (cf SVG spec 8.3.2)
|
|
176
174
|
while (pts.length >= 2) {
|
|
177
175
|
cx = cx + parseFloat(pts.shift())
|
|
178
176
|
cy = cy + parseFloat(pts.shift())
|
|
179
|
-
tmpCode += `${indent}${pathName} =
|
|
177
|
+
tmpCode += `${indent}${pathName} = path2.appendPoints([${svg2cag([cx, cy], svgUnitsPmm)}], ${pathName})\n`
|
|
180
178
|
}
|
|
181
179
|
break
|
|
182
180
|
case 'M': // absolute move to X,Y
|
|
@@ -191,14 +189,14 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
191
189
|
pi++
|
|
192
190
|
pc = false
|
|
193
191
|
pathName = on + pi
|
|
194
|
-
tmpCode += `${indent}${pathName} =
|
|
192
|
+
tmpCode += `${indent}${pathName} = path2.fromPoints({}, [[${svg2cag([cx, cy], svgUnitsPmm)}]])\n`
|
|
195
193
|
sx = cx; sy = cy
|
|
196
194
|
}
|
|
197
195
|
// optional implicit absolute lineTo (cf SVG spec 8.3.2)
|
|
198
196
|
while (pts.length >= 2) {
|
|
199
197
|
cx = parseFloat(pts.shift())
|
|
200
198
|
cy = parseFloat(pts.shift())
|
|
201
|
-
tmpCode += `${indent}${pathName} =
|
|
199
|
+
tmpCode += `${indent}${pathName} = path2.appendPoints([${svg2cag([cx, cy], svgUnitsPmm)}], ${pathName})\n`
|
|
202
200
|
}
|
|
203
201
|
break
|
|
204
202
|
case 'a': // relative elliptical arc
|
|
@@ -210,7 +208,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
210
208
|
const sf = (pts.shift() === '1')
|
|
211
209
|
cx = cx + parseFloat(pts.shift())
|
|
212
210
|
cy = cy + parseFloat(pts.shift())
|
|
213
|
-
tmpCode += `${indent}${pathName} =
|
|
211
|
+
tmpCode += `${indent}${pathName} = path2.appendArc({segments: ${segments}, endpoint: [${svg2cag([cx, cy], svgUnitsPmm)}], radius: [${svg2cag([rx, ry], svgUnitsPmm)}], xaxisrotation: ${ro}, clockwise: ${sf}, large: ${lf}}, ${pathName})\n`
|
|
214
212
|
}
|
|
215
213
|
break
|
|
216
214
|
case 'A': // absolute elliptical arc
|
|
@@ -222,7 +220,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
222
220
|
const sf = (pts.shift() === '1')
|
|
223
221
|
cx = parseFloat(pts.shift())
|
|
224
222
|
cy = parseFloat(pts.shift())
|
|
225
|
-
tmpCode += `${indent}${pathName} =
|
|
223
|
+
tmpCode += `${indent}${pathName} = path2.appendArc({segments: ${segments}, endpoint: [${svg2cag([cx, cy], svgUnitsPmm)}], radius: [${svg2cag([rx, ry], svgUnitsPmm)}], xaxisrotation: ${ro}, clockwise: ${sf}, large: ${lf}}, ${pathName})\n`
|
|
226
224
|
}
|
|
227
225
|
break
|
|
228
226
|
case 'c': // relative cubic Bézier
|
|
@@ -233,7 +231,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
233
231
|
by = cy + parseFloat(pts.shift())
|
|
234
232
|
cx = cx + parseFloat(pts.shift())
|
|
235
233
|
cy = cy + parseFloat(pts.shift())
|
|
236
|
-
tmpCode += `${indent}${pathName} =
|
|
234
|
+
tmpCode += `${indent}${pathName} = path2.appendBezier({segments: ${segments}, controlPoints: [[${svg2cag([x1, y1], svgUnitsPmm)}], [${svg2cag([bx, by], svgUnitsPmm)}], [${svg2cag([cx, cy], svgUnitsPmm)}]]}, ${pathName})\n`
|
|
237
235
|
const rf = reflect(bx, by, cx, cy)
|
|
238
236
|
bx = rf[0]
|
|
239
237
|
by = rf[1]
|
|
@@ -247,7 +245,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
247
245
|
by = parseFloat(pts.shift())
|
|
248
246
|
cx = parseFloat(pts.shift())
|
|
249
247
|
cy = parseFloat(pts.shift())
|
|
250
|
-
tmpCode += `${indent}${pathName} =
|
|
248
|
+
tmpCode += `${indent}${pathName} = path2.appendBezier({segments: ${segments}, controlPoints: [[${svg2cag([x1, y1], svgUnitsPmm)}], [${svg2cag([bx, by], svgUnitsPmm)}], [${svg2cag([cx, cy], svgUnitsPmm)}]]}, ${pathName})\n`
|
|
251
249
|
const rf = reflect(bx, by, cx, cy)
|
|
252
250
|
bx = rf[0]
|
|
253
251
|
by = rf[1]
|
|
@@ -262,7 +260,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
262
260
|
cy = cy + parseFloat(pts.shift())
|
|
263
261
|
const q1 = [p0[0] + (2/3) * (qx - p0[0]), p0[1] + (2/3) * (qy - p0[1])]
|
|
264
262
|
const q2 = [q1[0] + (1/3) * (cx - p0[0]), q1[1] + (1/3) * (cy - p0[1])]
|
|
265
|
-
tmpCode += `${indent}${pathName} =
|
|
263
|
+
tmpCode += `${indent}${pathName} = path2.appendBezier({segments: ${segments}, controlPoints: [[${svg2cag(q1, svgUnitsPmm)}], [${svg2cag(q2, svgUnitsPmm)}], [${svg2cag([cx, cy], svgUnitsPmm)}]]}, ${pathName})\n`
|
|
266
264
|
const rf = reflect(qx, qy, cx, cy)
|
|
267
265
|
qx = rf[0]
|
|
268
266
|
qy = rf[1]
|
|
@@ -277,7 +275,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
277
275
|
cy = parseFloat(pts.shift())
|
|
278
276
|
const q1 = [p0[0] + (2/3) * (qx - p0[0]), p0[1] + (2/3) * (qy - p0[1])]
|
|
279
277
|
const q2 = [q1[0] + (1/3) * (cx - p0[0]), q1[1] + (1/3) * (cy - p0[1])]
|
|
280
|
-
tmpCode += `${indent}${pathName} =
|
|
278
|
+
tmpCode += `${indent}${pathName} = path2.appendBezier({segments: ${segments}, controlPoints: [[${svg2cag(q1, svgUnitsPmm)}], [${svg2cag(q2, svgUnitsPmm)}], [${svg2cag([cx, cy], svgUnitsPmm)}]]}, ${pathName})\n`
|
|
281
279
|
const rf = reflect(qx, qy, cx, cy)
|
|
282
280
|
qx = rf[0]
|
|
283
281
|
qy = rf[1]
|
|
@@ -290,7 +288,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
290
288
|
cy = cy + parseFloat(pts.shift())
|
|
291
289
|
const q1 = [p0[0] + (2/3) * (qx - p0[0]), p0[1] + (2/3) * (qy - p0[1])]
|
|
292
290
|
const q2 = [q1[0] + (1/3) * (cx - p0[0]), q1[1] + (1/3) * (cy - p0[1])]
|
|
293
|
-
tmpCode += `${indent}${pathName} =
|
|
291
|
+
tmpCode += `${indent}${pathName} = path2.appendBezier({segments: ${segments}, controlPoints: [[[${svg2cag(q1, svgUnitsPmm)}], [${svg2cag(q2, svgUnitsPmm)}], [${svg2cag([cx, cy], svgUnitsPmm)}]]}, ${pathName})\n`
|
|
294
292
|
const rf = reflect(qx, qy, cx, cy)
|
|
295
293
|
qx = rf[0]
|
|
296
294
|
qy = rf[1]
|
|
@@ -303,7 +301,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
303
301
|
cy = parseFloat(pts.shift())
|
|
304
302
|
const q1 = [p0[0] + (2/3) * (qx - p0[0]), p0[1] + (2/3) * (qy - p0[1])]
|
|
305
303
|
const q2 = [q1[0] + (1/3) * (cx - p0[0]), q1[1] + (1/3) * (cy - p0[1])]
|
|
306
|
-
tmpCode += `${indent}${pathName} =
|
|
304
|
+
tmpCode += `${indent}${pathName} = path2.appendBezier({segments: ${segments}, controlPoints: [[[${svg2cag(q1, svgUnitsPmm)}], [${svg2cag(q2, svgUnitsPmm)}], [${svg2cag([cx, cy], svgUnitsPmm)}]]}, ${pathName})\n`
|
|
307
305
|
const rf = reflect(qx, qy, cx, cy)
|
|
308
306
|
qx = rf[0]
|
|
309
307
|
qy = rf[1]
|
|
@@ -317,7 +315,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
317
315
|
by = cy + parseFloat(pts.shift())
|
|
318
316
|
cx = cx + parseFloat(pts.shift())
|
|
319
317
|
cy = cy + parseFloat(pts.shift())
|
|
320
|
-
tmpCode += `${indent}${pathName} =
|
|
318
|
+
tmpCode += `${indent}${pathName} = path2.appendBezier({segments: ${segments}, controlPoints: [[${svg2cag([x1, y1], svgUnitsPmm)}], [${svg2cag([bx, by], svgUnitsPmm)}], [${svg2cag([cx, cy], svgUnitsPmm)}]]}, ${pathName})\n`
|
|
321
319
|
const rf = reflect(bx, by, cx, cy)
|
|
322
320
|
bx = rf[0]
|
|
323
321
|
by = rf[1]
|
|
@@ -331,7 +329,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
331
329
|
by = parseFloat(pts.shift())
|
|
332
330
|
cx = parseFloat(pts.shift())
|
|
333
331
|
cy = parseFloat(pts.shift())
|
|
334
|
-
tmpCode += `${indent}${pathName} =
|
|
332
|
+
tmpCode += `${indent}${pathName} = path2.appendBezier({segments: ${segments}, controlPoints: [[${svg2cag([x1, y1], svgUnitsPmm)}], [${svg2cag([bx, by], svgUnitsPmm)}], [${svg2cag([cx, cy], svgUnitsPmm)}]]}, ${pathName})\n`
|
|
335
333
|
const rf = reflect(bx, by, cx, cy)
|
|
336
334
|
bx = rf[0]
|
|
337
335
|
by = rf[1]
|
|
@@ -340,46 +338,46 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
340
338
|
case 'h': // relative Horzontal line to
|
|
341
339
|
while (pts.length >= 1) {
|
|
342
340
|
cx = cx + parseFloat(pts.shift())
|
|
343
|
-
tmpCode += `${indent}${pathName} =
|
|
341
|
+
tmpCode += `${indent}${pathName} = path2.appendPoints([[${svg2cag([cx, cy], svgUnitsPmm)}]], ${pathName})\n`
|
|
344
342
|
}
|
|
345
343
|
break
|
|
346
344
|
case 'H': // absolute Horzontal line to
|
|
347
345
|
while (pts.length >= 1) {
|
|
348
346
|
cx = parseFloat(pts.shift())
|
|
349
|
-
tmpCode += `${indent}${pathName} =
|
|
347
|
+
tmpCode += `${indent}${pathName} = path2.appendPoints([[${svg2cag([cx, cy], svgUnitsPmm)}]], ${pathName})\n`
|
|
350
348
|
}
|
|
351
349
|
break
|
|
352
350
|
case 'l': // relative line to
|
|
353
351
|
while (pts.length >= 2) {
|
|
354
352
|
cx = cx + parseFloat(pts.shift())
|
|
355
353
|
cy = cy + parseFloat(pts.shift())
|
|
356
|
-
tmpCode += `${indent}${pathName} =
|
|
354
|
+
tmpCode += `${indent}${pathName} = path2.appendPoints([[${svg2cag([cx, cy], svgUnitsPmm)}]], ${pathName})\n`
|
|
357
355
|
}
|
|
358
356
|
break
|
|
359
357
|
case 'L': // absolute line to
|
|
360
358
|
while (pts.length >= 2) {
|
|
361
359
|
cx = parseFloat(pts.shift())
|
|
362
360
|
cy = parseFloat(pts.shift())
|
|
363
|
-
tmpCode += `${indent}${pathName} =
|
|
361
|
+
tmpCode += `${indent}${pathName} = path2.appendPoints([[${svg2cag([cx, cy], svgUnitsPmm)}]], ${pathName})\n`
|
|
364
362
|
}
|
|
365
363
|
break
|
|
366
364
|
case 'v': // relative Vertical line to
|
|
367
365
|
while (pts.length >= 1) {
|
|
368
366
|
cy = cy + parseFloat(pts.shift())
|
|
369
|
-
tmpCode += `${indent}${pathName} =
|
|
367
|
+
tmpCode += `${indent}${pathName} = path2.appendPoints([[${svg2cag([cx, cy], svgUnitsPmm)}]], ${pathName})\n`
|
|
370
368
|
}
|
|
371
369
|
break
|
|
372
370
|
case 'V': // absolute Vertical line to
|
|
373
371
|
while (pts.length >= 1) {
|
|
374
372
|
cy = parseFloat(pts.shift())
|
|
375
|
-
tmpCode += `${indent}${pathName} =
|
|
373
|
+
tmpCode += `${indent}${pathName} = path2.appendPoints([[${svg2cag([cx, cy], svgUnitsPmm)}]], ${pathName})\n`
|
|
376
374
|
}
|
|
377
375
|
break
|
|
378
376
|
case 'z': // close current line
|
|
379
377
|
case 'Z':
|
|
380
|
-
tmpCode += `${indent}${pathName} =
|
|
378
|
+
tmpCode += `${indent}${pathName} = path2.close(${pathName})\n`
|
|
381
379
|
if (target === 'geom2') {
|
|
382
|
-
tmpCode += `${indent}${pathName} =
|
|
380
|
+
tmpCode += `${indent}${pathName} = geom2.create([path2.toPoints(${pathName})])\n`
|
|
383
381
|
}
|
|
384
382
|
tmpCode += `${indent}parts.push(${pathName})\n`
|
|
385
383
|
|
|
@@ -391,7 +389,7 @@ const path = (obj, svgUnitsPmm, svgUnitsX, svgUnitsY, svgUnitsV, params, svgGrou
|
|
|
391
389
|
console.log('Warning: Unknow PATH command [' + co.c + ']')
|
|
392
390
|
break
|
|
393
391
|
}
|
|
394
|
-
// console.log('postion: ['+cx+','+cy+'] after '+co.c)
|
|
392
|
+
// console.log('postion: ['+cx+','+cy+'] after '+co.c)
|
|
395
393
|
}
|
|
396
394
|
if (pi > 0 && pc === false) {
|
|
397
395
|
tmpCode += `${indent}parts.push(${pathName})\n`
|
package/src/svgElementHelpers.js
CHANGED
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
import { cagColor, cssStyle, css2cag } from './helpers.js'
|
|
2
|
+
import { pxPmm } from './constants.js'
|
|
3
3
|
|
|
4
|
-
const svgCore = (obj, element) => {
|
|
4
|
+
export const svgCore = (obj, element) => {
|
|
5
5
|
if ('id' in element) { obj.id = element.id }
|
|
6
6
|
if ('position' in element) { obj.position = element.position }
|
|
7
7
|
}
|
|
8
8
|
|
|
9
|
-
const svgPresentation = (obj, element) => {
|
|
9
|
+
export const svgPresentation = (obj, element) => {
|
|
10
10
|
// presentation attributes for all
|
|
11
11
|
if ('display' in element) { obj.visible = element.display }
|
|
12
12
|
// presentation attributes for solids
|
|
@@ -95,7 +95,7 @@ const svgTransforms = (cag, element) => {
|
|
|
95
95
|
|
|
96
96
|
const viewBoxRegExp = /([\d.-]+)[\s,]+([\d.-]+)[\s,]+([\d.-]+)[\s,]+([\d.-]+)/i
|
|
97
97
|
|
|
98
|
-
const svgSvg = (element, { customPxPmm }) => {
|
|
98
|
+
export const svgSvg = (element, { customPxPmm }) => {
|
|
99
99
|
// default SVG with no viewport
|
|
100
100
|
const obj = { type: 'svg', x: 0, y: 0, width: '100%', height: '100%', strokeWidth: '1' }
|
|
101
101
|
|
|
@@ -124,7 +124,7 @@ const svgSvg = (element, { customPxPmm }) => {
|
|
|
124
124
|
let s = css2cag(obj.width, customPxPmm) // width in millimeters
|
|
125
125
|
s = obj.viewW / s
|
|
126
126
|
// scale the default units
|
|
127
|
-
// obj.unitsPmm[0] = obj.unitsPmm[0] * s
|
|
127
|
+
// obj.unitsPmm[0] = obj.unitsPmm[0] * s
|
|
128
128
|
obj.unitsPmm[0] = s
|
|
129
129
|
} else {
|
|
130
130
|
// scale the default units by the width (%)
|
|
@@ -136,7 +136,7 @@ const svgSvg = (element, { customPxPmm }) => {
|
|
|
136
136
|
let s = css2cag(obj.height, pxPmm) // height in millimeters
|
|
137
137
|
s = obj.viewH / s
|
|
138
138
|
// scale the default units
|
|
139
|
-
// obj.unitsPmm[1] = obj.unitsPmm[1] * s
|
|
139
|
+
// obj.unitsPmm[1] = obj.unitsPmm[1] * s
|
|
140
140
|
obj.unitsPmm[1] = s
|
|
141
141
|
} else {
|
|
142
142
|
// scale the default units by the width (%)
|
|
@@ -160,7 +160,7 @@ const svgSvg = (element, { customPxPmm }) => {
|
|
|
160
160
|
return obj
|
|
161
161
|
}
|
|
162
162
|
|
|
163
|
-
const svgEllipse = (element) => {
|
|
163
|
+
export const svgEllipse = (element) => {
|
|
164
164
|
const obj = { type: 'ellipse', cx: '0', cy: '0', rx: '0', ry: '0' }
|
|
165
165
|
if ('cx' in element) { obj.cx = element.cx }
|
|
166
166
|
if ('cy' in element) { obj.cy = element.cy }
|
|
@@ -175,7 +175,7 @@ const svgEllipse = (element) => {
|
|
|
175
175
|
return obj
|
|
176
176
|
}
|
|
177
177
|
|
|
178
|
-
const svgLine = (element) => {
|
|
178
|
+
export const svgLine = (element) => {
|
|
179
179
|
const obj = { type: 'line', x1: '0', y1: '0', x2: '0', y2: '0' }
|
|
180
180
|
if ('x1' in element) { obj.x1 = element.x1 }
|
|
181
181
|
if ('y1' in element) { obj.y1 = element.y1 }
|
|
@@ -206,7 +206,7 @@ const svgListOfPoints = (list) => {
|
|
|
206
206
|
return points
|
|
207
207
|
}
|
|
208
208
|
|
|
209
|
-
const svgPolyline = (element) => {
|
|
209
|
+
export const svgPolyline = (element) => {
|
|
210
210
|
const obj = { type: 'polyline' }
|
|
211
211
|
// transforms
|
|
212
212
|
svgTransforms(obj, element)
|
|
@@ -221,7 +221,7 @@ const svgPolyline = (element) => {
|
|
|
221
221
|
return obj
|
|
222
222
|
}
|
|
223
223
|
|
|
224
|
-
const svgPolygon = (element) => {
|
|
224
|
+
export const svgPolygon = (element) => {
|
|
225
225
|
const obj = { type: 'polygon' }
|
|
226
226
|
// transforms
|
|
227
227
|
svgTransforms(obj, element)
|
|
@@ -236,7 +236,7 @@ const svgPolygon = (element) => {
|
|
|
236
236
|
return obj
|
|
237
237
|
}
|
|
238
238
|
|
|
239
|
-
const svgRect = (element) => {
|
|
239
|
+
export const svgRect = (element) => {
|
|
240
240
|
const obj = { type: 'rect', x: '0', y: '0', rx: '0', ry: '0', width: '0', height: '0' }
|
|
241
241
|
|
|
242
242
|
if ('x' in element) { obj.x = element.x }
|
|
@@ -263,7 +263,7 @@ const svgRect = (element) => {
|
|
|
263
263
|
return obj
|
|
264
264
|
}
|
|
265
265
|
|
|
266
|
-
const svgCircle = (element) => {
|
|
266
|
+
export const svgCircle = (element) => {
|
|
267
267
|
const obj = { type: 'circle', x: '0', y: '0', radius: '0' }
|
|
268
268
|
|
|
269
269
|
if ('cx' in element) { obj.x = element.cx }
|
|
@@ -278,7 +278,7 @@ const svgCircle = (element) => {
|
|
|
278
278
|
return obj
|
|
279
279
|
}
|
|
280
280
|
|
|
281
|
-
const svgGroup = (element) => {
|
|
281
|
+
export const svgGroup = (element) => {
|
|
282
282
|
const obj = { type: 'group' }
|
|
283
283
|
// transforms
|
|
284
284
|
svgTransforms(obj, element)
|
|
@@ -304,7 +304,7 @@ const svgGroup = (element) => {
|
|
|
304
304
|
//
|
|
305
305
|
// Convert the PATH element into object representation
|
|
306
306
|
//
|
|
307
|
-
const svgPath = (element) => {
|
|
307
|
+
export const svgPath = (element) => {
|
|
308
308
|
const obj = { type: 'path' }
|
|
309
309
|
// transforms
|
|
310
310
|
svgTransforms(obj, element)
|
|
@@ -415,7 +415,7 @@ const svgPath = (element) => {
|
|
|
415
415
|
// - append translate(x,y) if x,y available
|
|
416
416
|
// deep clone the referenced OBJECT and add to group
|
|
417
417
|
// - clone using JSON.parse(JSON.stringify(obj))
|
|
418
|
-
const svgUse = (element, { svgObjects }) => {
|
|
418
|
+
export const svgUse = (element, { svgObjects }) => {
|
|
419
419
|
const obj = { type: 'group' }
|
|
420
420
|
// transforms
|
|
421
421
|
svgTransforms(obj, element)
|
|
@@ -447,18 +447,3 @@ const svgUse = (element, { svgObjects }) => {
|
|
|
447
447
|
}
|
|
448
448
|
return obj
|
|
449
449
|
}
|
|
450
|
-
|
|
451
|
-
module.exports = {
|
|
452
|
-
svgCore,
|
|
453
|
-
svgPresentation,
|
|
454
|
-
svgSvg,
|
|
455
|
-
svgRect,
|
|
456
|
-
svgCircle,
|
|
457
|
-
svgEllipse,
|
|
458
|
-
svgLine,
|
|
459
|
-
svgPolyline,
|
|
460
|
-
svgPolygon,
|
|
461
|
-
svgGroup,
|
|
462
|
-
svgPath,
|
|
463
|
-
svgUse
|
|
464
|
-
}
|
package/tests/inkscape.test.js
CHANGED
|
@@ -1,10 +1,8 @@
|
|
|
1
|
-
|
|
1
|
+
import test from 'ava'
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
import { countOf } from '../../test/helpers/countOf.js'
|
|
4
4
|
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
// deserializer
|
|
5
|
+
import { deserialize } from '../src/index.js'
|
|
8
6
|
|
|
9
7
|
test('deserialize : translate svg produced by inkscape to script', (t) => {
|
|
10
8
|
const sourceSvg = `<?xml version="1.0" encoding="UTF-8" standalone="no"?>
|
|
@@ -52,13 +50,13 @@ test('deserialize : translate svg produced by inkscape to script', (t) => {
|
|
|
52
50
|
</svg>
|
|
53
51
|
`
|
|
54
52
|
|
|
55
|
-
let obs =
|
|
53
|
+
let obs = deserialize({ filename: 'inkscape', output: 'script', target: 'path', addMetaData: false }, sourceSvg)
|
|
56
54
|
t.is(typeof obs, 'string')
|
|
57
55
|
t.is(countOf('path2.fromPoints', obs), 2)
|
|
58
56
|
t.is(countOf('path2.close', obs), 2)
|
|
59
57
|
t.is(countOf('color', obs), 5)
|
|
60
58
|
|
|
61
|
-
obs =
|
|
59
|
+
obs = deserialize({ filename: 'inkscape', output: 'script', target: 'geom2', addMetaData: false }, sourceSvg)
|
|
62
60
|
t.is(countOf('path2.fromPoints', obs), 2)
|
|
63
61
|
t.is(countOf('path2.close', obs), 2)
|
|
64
62
|
t.is(countOf('color', obs), 5)
|