UNPKG

3.41 kBJavaScriptView Raw
1/* eslint-disable prefer-template,complexity */
2'use strict';
3
4const svgShapesToPath = {
5 rectToPath: svgShapesToPathRectToPath,
6 polylineToPath: svgShapesToPathPolylineToPath,
7 lineToPath: svgShapesToPathLineToPath,
8 circleToPath: svgShapesToPathCircleToPath,
9 polygonToPath: svgShapesToPathPolygonToPath,
10};
11
12module.exports = svgShapesToPath;
13
14// Shapes helpers (should also move elsewhere)
15function svgShapesToPathRectToPath(attributes) {
16 const x = 'undefined' !== typeof attributes.x ? parseFloat(attributes.x) : 0;
17 const y = 'undefined' !== typeof attributes.y ? parseFloat(attributes.y) : 0;
18 const width =
19 'undefined' !== typeof attributes.width ? parseFloat(attributes.width) : 0;
20 const height =
21 'undefined' !== typeof attributes.height
22 ? parseFloat(attributes.height)
23 : 0;
24 const rx =
25 'undefined' !== typeof attributes.rx
26 ? parseFloat(attributes.rx)
27 : 'undefined' !== typeof attributes.ry
28 ? parseFloat(attributes.ry)
29 : 0;
30 const ry =
31 'undefined' !== typeof attributes.ry ? parseFloat(attributes.ry) : rx;
32
33 return (
34 '' +
35 // start at the left corner
36 'M' +
37 (x + rx) +
38 ' ' +
39 y +
40 // top line
41 'h' +
42 (width - rx * 2) +
43 // upper right corner
44 (rx || ry ? 'a ' + rx + ' ' + ry + ' 0 0 1 ' + rx + ' ' + ry : '') +
45 // Draw right side
46 'v' +
47 (height - ry * 2) +
48 // Draw bottom right corner
49 (rx || ry ? 'a ' + rx + ' ' + ry + ' 0 0 1 ' + rx * -1 + ' ' + ry : '') +
50 // Down the down side
51 'h' +
52 (width - rx * 2) * -1 +
53 // Draw bottom right corner
54 (rx || ry
55 ? 'a ' + rx + ' ' + ry + ' 0 0 1 ' + rx * -1 + ' ' + ry * -1
56 : '') +
57 // Down the left side
58 'v' +
59 (height - ry * 2) * -1 +
60 // Draw bottom right corner
61 (rx || ry ? 'a ' + rx + ' ' + ry + ' 0 0 1 ' + rx + ' ' + ry * -1 : '') +
62 // Close path
63 'z'
64 );
65}
66
67function svgShapesToPathPolylineToPath(attributes) {
68 return 'M' + attributes.points;
69}
70
71function svgShapesToPathLineToPath(attributes) {
72 // Move to the line start
73 return (
74 '' +
75 'M' +
76 (parseFloat(attributes.x1) || 0).toString(10) +
77 ' ' +
78 (parseFloat(attributes.y1) || 0).toString(10) +
79 ' ' +
80 ((parseFloat(attributes.x1) || 0) + 1).toString(10) +
81 ' ' +
82 ((parseFloat(attributes.y1) || 0) + 1).toString(10) +
83 ' ' +
84 ((parseFloat(attributes.x2) || 0) + 1).toString(10) +
85 ' ' +
86 ((parseFloat(attributes.y2) || 0) + 1).toString(10) +
87 ' ' +
88 (parseFloat(attributes.x2) || 0).toString(10) +
89 ' ' +
90 (parseFloat(attributes.y2) || 0).toString(10) +
91 'Z'
92 );
93}
94
95function svgShapesToPathCircleToPath(attributes) {
96 const cx = parseFloat(attributes.cx);
97 const cy = parseFloat(attributes.cy);
98 const rx =
99 'undefined' !== typeof attributes.rx
100 ? parseFloat(attributes.rx)
101 : parseFloat(attributes.r);
102 const ry =
103 'undefined' !== typeof attributes.ry
104 ? parseFloat(attributes.ry)
105 : parseFloat(attributes.r);
106
107 // use two A commands because one command which returns to origin is invalid
108 return (
109 '' +
110 'M' +
111 (cx - rx) +
112 ',' +
113 cy +
114 'A' +
115 rx +
116 ',' +
117 ry +
118 ' 0,0,0 ' +
119 (cx + rx) +
120 ',' +
121 cy +
122 'A' +
123 rx +
124 ',' +
125 ry +
126 ' 0,0,0 ' +
127 (cx - rx) +
128 ',' +
129 cy
130 );
131}
132
133function svgShapesToPathPolygonToPath(attributes) {
134 return 'M' + attributes.points + 'Z';
135}