Skip to content

Commit 4dd45b1

Browse files
committed
shorten SVG inline syntax
1 parent 5ed2a2b commit 4dd45b1

File tree

1 file changed

+43
-57
lines changed

1 file changed

+43
-57
lines changed

src/renderers/svg.js

+43-57
Original file line numberDiff line numberDiff line change
@@ -20,8 +20,7 @@ class SVGRenderer{
2020
var encodingOptions = merge(this.options, encoding.options);
2121

2222
var group = this.createGroup(currentX, encodingOptions.marginTop, this.svg);
23-
24-
this.setGroupOptions(group, encodingOptions);
23+
group.setAttribute("fill", encodingOptions.lineColor);
2524

2625
this.drawSvgBarcode(group, encodingOptions, encoding);
2726
this.drawSVGText(group, encodingOptions, encoding);
@@ -32,7 +31,7 @@ class SVGRenderer{
3231

3332
prepareSVG(){
3433
// Clear the SVG
35-
while (this.svg.firstChild) {
34+
while (this.svg.firstChild){
3635
this.svg.removeChild(this.svg.firstChild);
3736
}
3837

@@ -44,9 +43,7 @@ class SVGRenderer{
4443
this.setSvgAttributes(width, maxHeight);
4544

4645
if(this.options.background){
47-
this.drawRect(0, 0, width, maxHeight, this.svg).setAttribute(
48-
"style", "fill:" + this.options.background + ";"
49-
);
46+
this.drawRect(0, 0, "100%", "100%", this.svg).setAttribute("fill", this.options.background);
5047
}
5148
}
5249

@@ -83,88 +80,77 @@ class SVGRenderer{
8380
}
8481

8582
drawSVGText(parent, options, encoding){
86-
var textElem = this.document.createElementNS(svgns, 'text');
87-
8883
// Draw the text if displayValue is set
89-
if(options.displayValue){
90-
var x, y;
84+
if(!options.displayValue){
85+
return;
86+
}
9187

92-
textElem.setAttribute("style",
93-
"font:" + options.fontOptions + " " + options.fontSize + "px " + options.font
94-
);
88+
var textElem = this.document.createElementNS(svgns, 'text');
89+
var x, y;
9590

96-
if(options.textPosition == "top"){
97-
y = options.fontSize - options.textMargin;
98-
}
99-
else{
100-
y = options.height + options.textMargin + options.fontSize;
101-
}
91+
if(options.textPosition == "top"){
92+
y = options.fontSize - options.textMargin;
93+
}
94+
else{
95+
y = options.height + options.textMargin + options.fontSize;
96+
}
10297

103-
// Draw the text in the correct X depending on the textAlign option
104-
if(options.textAlign == "left" || encoding.barcodePadding > 0){
105-
x = 0;
106-
textElem.setAttribute("text-anchor", "start");
107-
}
108-
else if(options.textAlign == "right"){
109-
x = encoding.width - 1;
110-
textElem.setAttribute("text-anchor", "end");
111-
}
112-
// In all other cases, center the text
113-
else{
114-
x = encoding.width / 2;
115-
textElem.setAttribute("text-anchor", "middle");
116-
}
98+
// Draw the text in the correct X depending on the textAlign option
99+
if(options.textAlign == "left" || encoding.barcodePadding > 0){
100+
x = 0;
101+
textElem.setAttribute("text-anchor", "start");
102+
}
103+
else if(options.textAlign == "right"){
104+
x = encoding.width - 1;
105+
textElem.setAttribute("text-anchor", "end");
106+
}
107+
// In all other cases, center the text
108+
else{
109+
x = encoding.width / 2;
110+
textElem.setAttribute("text-anchor", "middle");
111+
}
117112

118-
textElem.setAttribute("x", x);
119-
textElem.setAttribute("y", y);
113+
textElem.setAttribute("x", x);
114+
textElem.setAttribute("y", y);
120115

121-
textElem.appendChild(this.document.createTextNode(encoding.text));
116+
textElem.setAttribute("style", "font:" +
117+
trim(options.fontOptions + " " + options.fontSize + "px " + options.font)
118+
);
122119

123-
parent.appendChild(textElem);
124-
}
120+
textElem.appendChild(this.document.createTextNode(encoding.text));
121+
122+
parent.appendChild(textElem);
125123
}
126124

127125

128126
setSvgAttributes(width, height){
129127
var svg = this.svg;
130-
svg.setAttribute("width", width + "px");
131-
svg.setAttribute("height", height + "px");
132-
svg.setAttribute("x", "0px");
133-
svg.setAttribute("y", "0px");
134-
svg.setAttribute("viewBox", "0 0 " + width + " " + height);
135-
136128
svg.setAttribute("xmlns", svgns);
137-
svg.setAttribute("version", "1.1");
129+
svg.setAttribute("viewBox", "0 0 " + width + " " + height);
138130

139-
svg.setAttribute("style", "transform: translate(0,0)");
131+
rect.setAttribute("width", width);
132+
rect.setAttribute("height", height);
140133
}
141134

142135
createGroup(x, y, parent){
143136
var group = this.document.createElementNS(svgns, 'g');
144-
group.setAttribute("transform", "translate(" + x + ", " + y + ")");
137+
group.setAttribute("transform", "translate(" + x + "," + y + ")");
145138

146139
parent.appendChild(group);
147140

148141
return group;
149142
}
150143

151-
setGroupOptions(group, options){
152-
group.setAttribute("style",
153-
"fill:" + options.lineColor + ";"
154-
);
155-
}
156-
157144
drawRect(x, y, width, height, parent){
158145
var rect = this.document.createElementNS(svgns, 'rect');
159146

160-
rect.setAttribute("x", x);
161-
rect.setAttribute("y", y);
147+
if(x) rect.setAttribute("x", x);
148+
if(y) rect.setAttribute("y", y);
149+
162150
rect.setAttribute("width", width);
163151
rect.setAttribute("height", height);
164152

165153
parent.appendChild(rect);
166-
167-
return rect;
168154
}
169155
}
170156

0 commit comments

Comments
 (0)