├── img
├── license.svg
└── datamatrix.svg
├── LICENSE
├── README.md
├── datamatrix.min.js
└── datamatrix.js
/img/license.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2020 datalog
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | 
2 |
3 | ## Data Matrix svg generator [](/LICENSE)
4 | Data Matrix generator written on pure javascript. Produces highly optimized SVG nodes.
5 |
6 | [Data Matrix svg generator](https://datalog.github.io/demo/datamatrix-svg/) (Live demo)
7 |
8 | ## Easy to start
9 | After `datamatrix.min.js` is downloaded and connected to your html5 page, call:
10 | ```javascript
11 | var
12 | svgNode = DATAMatrix('Hello World!');
13 | ```
14 |
15 | All other options:
16 | ```javascript
17 | var
18 | svgNode = DATAMatrix({
19 |
20 | msg : "Your message here"
21 | ,dim : 256
22 | ,rct : 0
23 | ,pad : 2
24 | ,pal : ["#000000", "#f2f4f8"]
25 | ,vrb : 0
26 |
27 | });
28 | ```
29 |
30 | ## Options
31 | * **msg** - Data Matrix ``message``, obviously, this is **mandatory parameter**.
32 | * **rct** - set 1 to render rectangle Data Matrix if possible, default value is `0`.
33 | * **dim** - is equal to needed dimention (height) in pixels, default value is `256`.
34 | * **pad** - white space padding, default value is `2` blocks, set `0` for no padding.
35 | * **pal** - is array of [`color`,`background-color`] strings that represent hex color codes, default value is [`'#000'`] along with transparent background. Set [`'#000'`,`'#fff'`] to make background opaque.
36 | * **vrb** - svg node is optimized to be compact and default value is `0`, set this parameter to `1` in case you need more verbose output.
37 |
--------------------------------------------------------------------------------
/img/datamatrix.svg:
--------------------------------------------------------------------------------
1 |
--------------------------------------------------------------------------------
/datamatrix.min.js:
--------------------------------------------------------------------------------
1 | /** https://github.com/datalog/datamatrix-svg under MIT license */
2 | 'use strict';function DATAMatrix(r){var e=[],n=0,t=0,f=function(r,n){e[n]=e[n]||[],e[n][r]=1},o=function(r){for(var e=[],n=r.length,t=0;t47&&f<58&&o>47&&o<58?(e.push(10*(f-48)+o+82),t++):f>127?(e.push(235),e.push(f-127&255)):e.push(f+1)}return e},h=function(r,e){var n,t,f=0,h=0,i=r.length,u=[e[0]],a=function(r){h=40*h+r,2==f++&&(u.push(++h>>8),u.push(255&h),f=h=0)};for(n=0;n127&&238!=u[0]&&(a(1),a(30),s-=128),t=1;s>e[t];t+=3);var l=e[t+1];if(8==l||9==l&&0==f&&n==i-1)return[];if(l<5&&2==f&&n==i-1)break;l<5&&a(l),a(s-e[t+2])}return 2==f&&238!==u[0]&&a(0),u.push(254),(f>0||n0&&s0&&s0&&s0?[240]:[],i=0;i94)return[]}else e=31;f=64*f+(63&e),3==(3&i)&&(h.push(f>>16),h.push(f>>8&255),h.push(255&f),f=0)}return t>n?h:h.concat(o(r.substr(0==t?0:t-1)))}(r)).length)>0&&s0&&s25&&(m=2)}else{c=l=6,g=2,a=[5,7,10,12,14,18,20,24,28,36,42,48,56,68,84,112,144,192,224,272,336,408,496,620];do{if(++b==a.length)return[0,0];c>11*g&&(g=4+g&12),s=(c=l+=g)*l>>3}while(s-a[b]27&&(C=m=2*(c/54|0)+2),s>255&&(y=2*(s>>9)+2)}for(p=c/m,v=l/C,u255&&(b^=301);for(M[A]=0,g=1;g<=A;g++)for(M[b=A-g]=1;b=c||w>=l||d<0)for(w+=2+(A=-A)/2,d+=2-A/2;w<0||d>=c||w>=l||d<0;)w-=A,d+=A;if(w==l-2&&0==d&&3&c)a=[c-1,3-l,c-1,2-l,c-2,2-l,c-3,2-l,c-4,2-l,0,1,0,0,0,-1];else if(w==l-2&&0==d&&4==(7&c))a=[c-1,5-l,c-1,4-l,c-1,3-l,c-1,2-l,c-2,2-l,0,1,0,0,0,-1];else{if(1==w&&d==c-1&&0==(7&c)&&6==(7&l))continue;a=y}}for(u=i[g++],b=0;u>0;b+=2,u>>=1)if(1&u){var j=d+a[b],k=w+a[b+1];j<0&&(j+=c,k+=4-(c+4&7)),k<0&&(k+=l,j+=4-(l+4&7)),f(j+2*(j/p|0)+1,k+2*(k/v|0)+1)}}for(g=c;3&g;g--)f(g,g);n=c+2*m,t=l+2*C};return function(){function f(r){return/^#[0-9a-f]{3}(?:[0-9a-f]{3})?$/i.test(r)}function o(r,e){for(var n in r=document.createElementNS(g,r),e||{})r.setAttribute(n,e[n]);return r}var h,u,a,s,l,c,p,v=Math.abs,g="http://www.w3.org/2000/svg",d="",w="string"==typeof r?{msg:r}:r||{},A=w.pal||["#000"],m=v(w.dim)||256,C=[1,0,0,1,p=(p=v(w.pad))>-1?p:2,p],b=f(b=A[0])?b:"#000",y=f(y=A[1])?y:0,M=w.vrb?0:1;for(i(w.msg||"",w.rct),l=n+2*p,c=t+2*p,a=t;a--;)for(s=0,u=n;u--;)e[a][u]&&(M?(s++,e[a][u-1]||(d+="M"+u+","+a+"h"+s+"v1h-"+s+"v-1z",s=0)):d+="M"+u+","+a+"h1v1h-1v-1z");return h=o("svg",{viewBox:[0,0,l,c].join(" "),width:m/c*l|0,height:m,fill:b,"shape-rendering":"crispEdges",xmlns:g,version:"1.1"}),y&&h.appendChild(o("path",{fill:y,d:"M0,0v"+c+"h"+l+"V0H0Z"})),h.appendChild(o("path",{transform:"matrix("+C+")",d:d})),h}()}
--------------------------------------------------------------------------------
/datamatrix.js:
--------------------------------------------------------------------------------
1 | /**
2 | https://github.com/datalog/datamatrix-svg
3 | under MIT license
4 | # datamatrix.js has no dependencies
5 | Copyright (c) 2020 Constantine
6 | */
7 |
8 | 'use strict';
9 |
10 | function DATAMatrix( Q ) {
11 |
12 | var
13 | M = []
14 | ,xx = 0
15 | ,yy = 0
16 |
17 | ,bit = function( x, y ) {
18 |
19 | M[ y ] = M[ y ] || [],
20 | M[ y ][ x ] = 1;
21 | }
22 |
23 | ,toAscii = function( t ) {
24 |
25 | var
26 | r = [],
27 | l = t.length;
28 |
29 | for( var i = 0; i < l; i++ ) {
30 |
31 | var
32 | c = t.charCodeAt( i ),
33 | c1 = ( i + 1 < l ) ? t.charCodeAt( i + 1 ) : 0;
34 |
35 | if( c > 47 && c < 58 && c1 > 47 && c1 < 58 ) { /* 2 digits */
36 |
37 | r.push( ( c - 48 ) * 10 + c1 + 82 ), /* - 48 + 130 = 82 */
38 | i++;
39 |
40 | } else if( c > 127 ) { /* extended char */
41 |
42 | r.push( 235 ),
43 | r.push( ( c - 127 ) & 255 );
44 |
45 | } else r.push( c + 1 ); /* char */
46 | }
47 |
48 | return r;
49 | }
50 |
51 | ,toBase = function( t ) {
52 |
53 | var
54 | r = [ 231 ], /* switch to Base 256 */
55 | l = t.length;
56 |
57 | if( 250 < l ) {
58 |
59 | r.push( 37 + ( l / 250 | 0 ) & 255 ); /* length high byte (in 255 state algo) */
60 | }
61 |
62 | r.push( l % 250 + 149 * ( r.length + 1 ) % 255 + 1 & 255 ); /* length low byte (in 255 state algo) */
63 |
64 | for( var i = 0; i < l; i++ ) {
65 |
66 | r.push( t.charCodeAt( i ) + 149 * ( r.length + 1 ) % 255 + 1 & 255 ); /* data in 255 state algo */
67 | }
68 |
69 | return r;
70 | }
71 |
72 | ,toEdifact = function( t ) {
73 |
74 | var
75 | n = t.length,
76 | l = ( n + 1 ) & -4, cw = 0, ch,
77 | r = ( l > 0 ) ? [ 240 ] : []; /* switch to Edifact */
78 |
79 | for( var i = 0; i < l; i++ ) {
80 |
81 | if( i < l - 1 ) {
82 |
83 | /* encode char */
84 | ch = t.charCodeAt( i );
85 | if( ch < 32 || ch > 94 ) return []; /* not in set */
86 |
87 | } else ch = 31; /* return to ASCII */
88 |
89 | cw = cw * 64 + ( ch & 63 );
90 |
91 | if(( i & 3 ) == 3 ) {
92 |
93 | /* 4 data in 3 words */
94 | r.push( cw >> 16 ),
95 | r.push( cw >> 8& 255 ),
96 | r.push( cw & 255 ),
97 | cw = 0;
98 | }
99 | };
100 |
101 | return l > n ? r : r.concat( toAscii( t.substr( l == 0 ? 0 : l - 1 ) ) ); /* last chars*/
102 | }
103 |
104 | ,toText = function( t, s ) {
105 |
106 | var
107 | i, j,
108 | cc = 0,
109 | cw = 0,
110 | l = t.length,
111 | r = [ s[ 0 ] ], /* start switch */
112 | push = function( v ) {
113 |
114 | /* pack 3 chars in 2 codes */
115 | cw = 40 * cw + v;
116 |
117 | /* add code */
118 | if( cc++ == 2 ) {
119 |
120 | r.push( ++cw >> 8 ),
121 | r.push( cw & 255 ),
122 | cc = cw = 0;
123 | }
124 | };
125 |
126 | for( i = 0; i < l; i++ ) {
127 |
128 | /* last char in ASCII is shorter */
129 | if( 0 == cc && i == l - 1 ) break;
130 |
131 | var
132 | ch = t.charCodeAt(i);
133 |
134 | if( ch > 127 && 238 != r[ 0 ] ) { /* extended char */
135 |
136 | push( 1 ),
137 | push( 30 ),
138 | ch -= 128; /* hi bit in C40 & TEXT */
139 | }
140 |
141 | for( j = 1; ch > s[ j ]; j += 3 ); /* select char set */
142 |
143 | var
144 | x = s[ j + 1 ]; /* shift */
145 |
146 |
147 | if( 8 == x || ( 9 == x && 0 == cc && i == l - 1 ) ) return []; /* char not in set or padding fails */
148 |
149 | if( x < 5 && cc == 2 && i == l-1) break; /* last char in ASCII */
150 | if( x < 5 ) push( x ); /* shift */
151 |
152 | push( ch - s[ j + 2 ] ); /* char offset */
153 | }
154 |
155 | if(2 == cc && 238 !== r[ 0 ] ) { /* add pad */
156 |
157 | push( 0 );
158 | }
159 |
160 | r.push( 254 ); /* return to ASCII */
161 |
162 | if( cc > 0 || i < l ) r = r.concat( toAscii( t.substr( i - cc ) ) ); /* last chars */
163 |
164 | return r;
165 | }
166 |
167 | ,encodeMsg = function( text, rct ) {
168 |
169 | text = unescape( encodeURI( text ) );
170 |
171 | var
172 | M = [];
173 |
174 | var
175 | enc = toAscii( text ),
176 | el = enc.length,
177 |
178 | k = toText( text, [ /* C40 */
179 | 230,
180 | 31, 0, 0,
181 | 32, 9, 29,
182 | 47, 1, 33,
183 | 57, 9, 44,
184 | 64, 1, 43,
185 | 90, 9, 51,
186 | 95, 1, 69,
187 | 127, 2, 96,
188 | 255, 1, 0
189 | ]),
190 | l = k.length;
191 | if( l > 0 && l < el ) enc = k, el = l;
192 |
193 |
194 | k = toText( text, [ /* TEXT */
195 | 239,
196 | 31, 0, 0,
197 | 32, 9, 29,
198 | 47, 1, 33,
199 | 57, 9, 44,
200 | 64, 1, 43,
201 | 90, 2, 64,
202 | 95, 1, 69,
203 | 122, 9, 83,
204 | 127, 2, 96,
205 | 255, 1, 0
206 | ]);
207 | l = k.length;
208 | if( l > 0 && l < el ) enc = k, el = l;
209 |
210 | k = toText( text, [ /* X12*/
211 | 238,
212 | 12, 8, 0,
213 | 13, 9, 13,
214 | 31, 8, 0,
215 | 32, 9, 29,
216 | 41, 8, 0,
217 | 42, 9, 41,
218 | 47, 8, 0,
219 | 57, 9, 44,
220 | 64, 8, 0,
221 | 90, 9, 51,
222 | 255, 8, 0
223 | ]);
224 | l = k.length;
225 | if( l > 0 && l < el ) enc = k, el = l;
226 |
227 | k = toEdifact( text ); l = k.length;
228 | if( l > 0 && l < el ) enc = k, el = l;
229 |
230 | k = toBase( text ); l = k.length;
231 | if( l > 0 && l < el ) enc = k, el = l;
232 |
233 |
234 | var
235 | h, w, nc = 1, nr = 1, fw, fh, /* symbol size, regions, region size */
236 | i, j = - 1, c, r, s, b = 1, /* compute symbol size */
237 |
238 | rs = new Array( 70 ), /* reed / solomon code */
239 | rc = new Array( 70 ),
240 | lg = new Array( 256 ), /* log / exp table for multiplication */
241 | ex = new Array( 255 );
242 |
243 | if( rct && el < 50 ) {
244 |
245 | /* rect */
246 |
247 | k = [ /* symbol width, checkwords */
248 | 16, 7,
249 | 28, 11,
250 | 24, 14,
251 | 32, 18,
252 | 32, 24,
253 | 44, 28
254 | ];
255 |
256 | do {
257 | w = k[ ++j ]; /* width */
258 | h = 6 + ( j & 12 ); /* height */
259 | l = w * h / 8; /* bytes count in symbol */
260 |
261 | } while( l - k[ ++j ] < el ); /* could we fill the rect? */
262 |
263 | /* column regions */
264 | if( w > 25 ) nc = 2;
265 |
266 | } else {
267 |
268 | /* square */
269 |
270 | w = h = 6;
271 | i = 2; /* size increment */
272 | k = [ 5, 7, 10, 12, 14, 18, 20, 24, 28, 36, 42, 48, 56, 68, 84, 112, 144, 192, 224, 272, 336, 408, 496, 620 ]; /* rs checkwords */
273 |
274 | do {
275 | if( ++j == k.length ) return [ 0, 0 ]; /* msg is too long */
276 |
277 | if( w > 11 * i ) i = 4 + i & 12; /* advance increment */
278 |
279 | w = h += i;
280 | l = ( w * h ) >> 3;
281 |
282 | } while( l - k[ j ] < el );
283 |
284 | if( w > 27 ) nr = nc = 2 * ( w / 54 | 0 ) + 2; /* regions */
285 | if( l > 255 ) b = 2 * ( l >> 9 ) + 2; /* blocks */
286 | }
287 |
288 |
289 | s = k[ j ], /* rs checkwords */
290 | fw = w / nc, /* region size */
291 | fh = h / nr;
292 |
293 | /* first padding */
294 | if( el < l - s ) enc[ el++ ] = 129;
295 |
296 | /* more padding */
297 | while( el < l - s ) {
298 |
299 | enc[ el++ ] = ( ( ( 149 * el ) % 253 ) + 130 ) % 254;
300 | }
301 |
302 |
303 | /* Reed Solomon error detection and correction */
304 | s /= b;
305 |
306 | /* log / exp table of Galois field */
307 | for( j = 1, i = 0; i < 255; i++ ) {
308 |
309 | ex[ i ] = j,
310 | lg[ j ] = i,
311 | j += j;
312 |
313 | if( j > 255 ) j ^= 301; /* 301 == a^8 + a^5 + a^3 + a^2 + 1 */
314 | }
315 |
316 | /* RS generator polynomial */
317 | for( rs[ s ] = 0, i = 1; i <= s; i++ )
318 | for( j = s - i, rs[ j ] = 1; j < s; j++ )
319 | rs[ j ] = rs[ j + 1 ] ^ ex[ ( lg[ rs[ j ] ] + i ) % 255 ];
320 |
321 | /* RS correction data for each block */
322 | for( c = 0; c < b; c++ ) {
323 | for( i = 0; i <= s; i++ ) rc[ i ] = 0;
324 | for( i = c; i < el; i += b )
325 | for( j = 0, x = rc[ 0 ] ^ enc[ i ]; j < s; j++ )
326 | rc[ j ] = rc[ j + 1 ] ^ ( x ? ex[ ( lg[ rs[ j ] ] + lg[ x ] ) % 255 ] : 0 );
327 |
328 | /* interleaved correction data */
329 | for( i = 0; i < s; i++ )
330 | enc[ el + c + i * b ] = rc[ i ];
331 | }
332 |
333 | /* layout perimeter finder pattern */
334 | /* horizontal */
335 | for( i = 0; i < h + 2 * nr; i += fh + 2 )
336 | for( j = 0; j < w + 2 * nc; j++ ) {
337 | bit( j, i + fh + 1 );
338 | if( ( j & 1 ) == 0 ) bit( j, i );
339 | }
340 |
341 | /* vertical */
342 | for( i = 0; i < w + 2 * nc; i += fw + 2 )
343 | for( j = 0; j < h; j++ ) {
344 | bit( i, j + ( j / fh | 0 ) * 2 + 1 );
345 | if( ( j & 1 ) == 1 ) bit( i + fw + 1, j + ( j / fh | 0 ) * 2 );
346 | }
347 |
348 | s = 2, /* step */
349 | c = 0, /* column */
350 | r = 4, /* row */
351 | b = [ /* nominal byte layout */
352 | 0, 0,
353 | -1, 0,
354 | -2, 0,
355 | 0, -1,
356 | -1, -1,
357 | -2, -1,
358 | -1, -2,
359 | -2, -2
360 | ];
361 |
362 | /* diagonal steps */
363 | for( i = 0; i < l; r -= s, c += s ) {
364 |
365 | if( r == h - 3 && c == - 1 )
366 |
367 | k = [ /* corner A layout */
368 | w, 6 - h,
369 | w, 5 - h,
370 | w, 4 - h,
371 | w, 3 - h,
372 | w - 1, 3 - h,
373 | 3, 2,
374 | 2, 2,
375 | 1, 2
376 | ];
377 |
378 | else if( r == h + 1 && c == 1 && ( w & 7 ) == 0 && ( h & 7 ) == 6 )
379 |
380 | k = [ /* corner D layout */
381 | w - 2, -h,
382 | w - 3, -h,
383 | w - 4, -h,
384 | w - 2, -1 - h,
385 | w - 3, -1 - h,
386 | w - 4, -1 - h,
387 | w - 2, -2,
388 | -1, -2
389 | ];
390 | else {
391 | if( r == 0 && c == w - 2 && ( w & 3 ) ) continue; /* corner B: omit upper left */
392 | if( r < 0 || c >= w || r >= h || c < 0 ) { /* outside */
393 |
394 | s = -s, /* turn around */
395 | r += 2 + s / 2,
396 | c += 2 - s / 2;
397 |
398 | while( r < 0 || c >= w || r >= h || c < 0 ) {
399 |
400 | r -= s,
401 | c += s;
402 | }
403 | }
404 | if( r == h - 2 && c == 0 && ( w & 3 ) )
405 |
406 | k = [ /* corner B layout */
407 | w - 1, 3 - h,
408 | w - 1, 2 - h,
409 | w - 2, 2 - h,
410 | w - 3, 2 - h,
411 | w - 4, 2 - h,
412 | 0, 1,
413 | 0, 0,
414 | 0, -1
415 | ];
416 |
417 | else if( r == h - 2 && c == 0 && ( w & 7 ) == 4 )
418 |
419 | k = [ /* corner C layout */
420 | w - 1, 5 - h,
421 | w - 1, 4 - h,
422 | w - 1, 3 - h,
423 | w - 1, 2 - h,
424 | w - 2, 2 - h,
425 | 0, 1,
426 | 0, 0,
427 | 0, -1
428 | ];
429 |
430 | else if( r == 1 && c == w - 1 && ( w & 7 ) == 0 && ( h & 7 ) == 6 ) continue; /* omit corner D */
431 | else k = b; /* nominal L - shape layout */
432 | }
433 |
434 | /* layout each bit */
435 | for( el = enc[ i++ ], j = 0; el > 0; j += 2, el >>= 1 ) {
436 |
437 | if( el & 1 ) {
438 |
439 | var
440 | x = c + k[ j ],
441 | y = r + k[ j + 1 ];
442 |
443 | /* wrap around */
444 | if( x < 0 ) x += w, y += 4 - ( ( w + 4 ) & 7 );
445 | if( y < 0 ) y += h, x += 4 - ( ( h + 4 ) & 7 );
446 |
447 | /* region gap */
448 | bit( x + 2 * ( x / fw | 0 ) + 1, y + 2 * ( y / fh | 0 ) + 1 );
449 | }
450 | }
451 | }
452 |
453 |
454 |
455 | /* unfilled corner */
456 | for( i = w; i & 3; i-- ) {
457 |
458 | bit( i, i );
459 | }
460 |
461 | xx = w + 2 * nc,
462 | yy = h + 2 * nr;
463 | }
464 |
465 | return ( function() {
466 |
467 | function ishex( c ) {
468 |
469 | return /^#[0-9a-f]{3}(?:[0-9a-f]{3})?$/i.test( c );
470 | }
471 |
472 | function svg( n, a ) {
473 |
474 | n = document.createElementNS( ns, n );
475 |
476 | for( var o in a || {} ) {
477 |
478 | n.setAttribute( o, a[ o ] );
479 | }
480 |
481 | return n;
482 | }
483 |
484 | var
485 | abs = Math.abs,
486 | r, x, y, d, sx, sy,
487 |
488 | ns = 'http://www.w3.org/2000/svg',
489 | path = '',
490 |
491 | q = ('string' == typeof Q ) ? { msg: Q } : Q || {},
492 | p = q.pal || ['#000'],
493 | dm = abs( q.dim ) || 256,
494 | pd = abs( q.pad ), pd = ( pd > -1 ) ? pd : 2,
495 | mx = [ 1, 0, 0, 1, pd, pd ],
496 |
497 | fg = p[ 0 ], fg = ishex( fg ) ? fg : '#000',
498 | bg = p[ 1 ], bg = ishex( bg ) ? bg : 0,
499 |
500 | /* render optimized or verbose svg */
501 | optimized = ( q.vrb ) ? 0 : 1;
502 |
503 | encodeMsg( q.msg || '', q.rct );
504 |
505 | sx = xx + pd * 2,
506 | sy = yy + pd * 2;
507 |
508 | y = yy;
509 |
510 | while( y-- ) {
511 |
512 | d = 0, x = xx;
513 |
514 | while( x-- ) {
515 |
516 | if( M[ y ][ x ] ) {
517 |
518 | if( optimized ) {
519 |
520 | d++;
521 |
522 | if( !M[ y ][ x - 1 ] )
523 |
524 | path += 'M' + x + ',' + y + 'h' + d +'v1h-' + d + 'v-1z', d = 0;
525 |
526 | } else path += 'M' + x + ',' + y + 'h1v1h-1v-1z';
527 | }
528 | }
529 | }
530 |
531 |
532 | r = svg('svg', {
533 |
534 | 'viewBox' : [ 0, 0, sx, sy ].join(' ')
535 | ,'width' : dm / sy * sx | 0
536 | ,'height' : dm
537 | ,'fill' : fg
538 | ,'shape-rendering' : 'crispEdges'
539 | ,'xmlns' : ns
540 | ,'version' : '1.1'
541 | } );
542 |
543 | if( bg ) r.appendChild( svg('path', {
544 |
545 | 'fill' : bg
546 | ,'d' : 'M0,0v' + sy + 'h' + sx + 'V0H0Z'
547 | } ) );
548 |
549 | r.appendChild( svg('path', {
550 |
551 | 'transform' : 'matrix(' + mx + ')'
552 | ,'d' : path
553 | } ) );
554 |
555 | return r;
556 |
557 | } )();
558 | }
--------------------------------------------------------------------------------