 |
 |
07-30-2012, 02:32 PM
|
 |
Freshman
|
|
Join Date: Aug 2009
Location: São Paulo, Brazil
Posts: 29
|
|
Function to create barcode (Code 39, output in SVG graphics)
|
Hello People,
I work on an application which generates several custom reports, for which I chose the HTML format for output. Then, I needed to add a barcode identification in some of these reports, which go for printing. My working scenario excludes the possibility of working with TrueType barcode fonts, for my organization wouldn't allow me to install them, and I didn't manage to find in the web some finished and ready solution to my problem. This is partly my own fault, for I only understand code in VB, maybe a little JavaScript but...
So I wrote from scratch, with nothing but the Code 39 Specification itself, the function below. It is supposed to generate an SVG graphic (actually a XML species) which can be embedded in my HTML output. It worked fine and the printed samples were scanned ok.
Here it goes, for your analysis. I hope it becomes handy for someone who was in such a hurry as me. Please show your appreciation by detecting its flaws, improving it and spreading it freely. Thank you very much.
Code:
Friend Module General
Friend Function Barcode(ByVal Expr As String) As String
Dim Chrs As String = "0123456789ABCDEFGHIJKLMNOPQRSTUVWXYZ-. $/+%*"
Dim Bar1 As String = "01010100101010100100101010010010101001000000"
Dim Spc1 As String = "00000000000000000000000000000011111111111101"
Dim Bar2 As String = "00110010010110010010011001001001100100100000"
Dim Spc2 As String = "11111111110000000000000000000000000000011010"
Dim Bar3 As String = "10001110000001110001000111000100011100000001"
Dim Spc3 As String = "00000000001111111111000000000000000000010110"
Dim Bar4 As String = "10000001110000001111000000111100000011100001"
Dim Spc4 As String = "00000000000000000000111111111100000000001110"
Dim Bar5 As String = "01101001001101001000110100100011010010000000"
Dim Base As Double = 1
Dim Unit As String = "px"
Dim Heig As Double = Base * 30
Dim Qiet As Double = Base * 10
Dim PosX As Double = 0
Dim PosY As Double = 0
Dim Pitc As Double
Dim StrB As New System.Text.StringBuilder
StrB.Append("*"c)
For Each c As Char In Expr.ToUpper.ToCharArray
If Chrs.Contains(c) And Not c.Equals("*"c) Then StrB.Append(c)
Next
StrB.Append("*"c)
Expr = StrB.ToString
StrB.Clear()
StrB.Append("<svg xmlns='http://www.w3.org/2000/svg' version='1.1'>")
StrB.Append(TagSVGrect(PosX, PosY, Qiet, Heig, Unit, "white"))
PosX += Qiet
For Each c As Char In Expr.ToCharArray
Pitc = Base * (1 + 1.5 * Val(Bar1.Chars(Chrs.IndexOf(c))))
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "black"))
PosX += Pitc
Pitc = Base * (1 + 1.5 * Val(Spc1.Chars(Chrs.IndexOf(c))))
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "white"))
PosX += Pitc
Pitc = Base * (1 + 1.5 * Val(Bar2.Chars(Chrs.IndexOf(c))))
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "black"))
PosX += Pitc
Pitc = Base * (1 + 1.5 * Val(Spc2.Chars(Chrs.IndexOf(c))))
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "white"))
PosX += Pitc
Pitc = Base * (1 + 1.5 * Val(Bar3.Chars(Chrs.IndexOf(c))))
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "black"))
PosX += Pitc
Pitc = Base * (1 + 1.5 * Val(Spc3.Chars(Chrs.IndexOf(c))))
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "white"))
PosX += Pitc
Pitc = Base * (1 + 1.5 * Val(Bar4.Chars(Chrs.IndexOf(c))))
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "black"))
PosX += Pitc
Pitc = Base * (1 + 1.5 * Val(Spc4.Chars(Chrs.IndexOf(c))))
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "white"))
PosX += Pitc
Pitc = Base * (1 + 1.5 * Val(Bar5.Chars(Chrs.IndexOf(c))))
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "black"))
PosX += Pitc
Pitc = Base
StrB.Append(TagSVGrect(PosX, PosY, Pitc, Heig, Unit, "white"))
PosX += Pitc
Next
StrB.Append(TagSVGrect(PosX, PosY, Qiet, Heig, Unit, "white"))
StrB.Append("</svg>")
Return StrB.ToString
End Function
Friend Function TagSVGrect(ByVal x As Double, ByVal y As Double, ByVal w As Double, ByVal h As Double,
ByVal unit As String, ByVal color As String) As String
Return "<rect x='" & x.ToString("0.00").Replace(","c, "."c) & unit &
"' y='" & y.ToString("0.00").Replace(","c, "."c) & unit &
"' width='" & w.ToString("0.00").Replace(","c, "."c) & unit &
"' height='" & h.ToString("0.00").Replace(","c, "."c) & unit &
"' style='fill:" & color & "' />"
End Function
|
|
07-31-2012, 12:28 PM
|
|
Contributor
* Expert *
|
|
Join Date: Feb 2004
Posts: 522
|
|
No native support for SVG graphics in IE6 thru 8
Quote:
|
Originally Posted by VBobCat
It is supposed to generate an SVG graphic (actually a XML species) which can be embedded in my HTML output.
|
Thanks for sharing, VBobCat,
but one of the critical issues for SVG,
(as I'm sure most of the forum members already know),
is the lack of native support for SVG in Internet Explorer version 6 though 8.
Here is the page where Tim Berners-Lee takes Microsoft to task for being slow to support SVG graphics.
Yes, there are SVG IE plugins (like these: 1, 2) but not may people have them installed
(and as a programmer I would not assume that they have them installed,
therefore I could not assume that my code had IE6 thru IE8 support).
In case you were wondering why IE8 is still so heavily used, since IE9 has been out for a while..
There are still many people running older computer hardware,
that doesn't support the video or memory requirements to run Vista or Windows7.
These people are somewhat stuck with WinXP and since Microsoft doesn't provide support for IE9 under WindowsXP,
so there are still a lot of WinXP users whose IE upgrade path is limited to IE8.
(Of course the smart WinXP users have dumped IE for Firefox, or some version of Chrome, long ago
but IE remains the default browser for WinXP, which is why the non-smart, and lazy, people are still using it).
If it were me I would port this barcode generation code over to HTML5 canvas DOM element code.
Why?
Even though IE6 through IE8 also doesn't have HTML5 canvas element support,
it is possible to provide VML emulation for HTML5 canvas code through a
free javascript library called ExplorerCanvas.
I know HTML5 canvas support is never going to be removed from the
the HTML specification because Apple is pushing it to replace Flash
on mobile iOS devices, so it is probably a better long term solution
for generating bar codes on the fly for web pages via AJAX/oDATA/json/ json-p.
For those who are going:
" Die IE6 --please die already!" camp,
the ie6coutdown remains at 6% worldwide ( less than 1% in the U.S.A).
If you, or anyone you know, still is running IE6,
(the version of IE that is rated #8 on PCWorld's
" 25 Worst Tech Products of All Time" for it's
malware vulnerabilities and the bane of web designers everywhere
for it's non-compliance with W3C standards, throwing IE6 into quirks mode not withstanding),
please help by see to its removal immediately for any and all computers,
so we can bring this down to 0%. |
Last edited by hDC_0; 07-31-2012 at 12:47 PM.
|
07-31-2012, 03:11 PM
|
|
Freshman
|
|
Join Date: Aug 2009
Location: São Paulo, Brazil
Posts: 29
|
|
|
Yes, I understand these issues, although the SVG-based solution serves me well, for my organization has already migrated almost completely to IE9, and has at least IE8 on remaining machines.
But it is fair enough to expect a general solution to be as universal as possible.
SVG was my first choice for the simple reason that it was the first format I found that seems so simple to write and to embed.
But then I have to ask one question about compatibility.
- If the HTML document containing the SVG graphic is shown inside my application, in a WebBrowser control, made with .NET Framework 4.0, will it depend on the version of IE installed on each computer?
And a few more questions, these due to my lack of knowlege on HTML5:
- HTML5 must be also a XML derivation, but... is it as simple as SVG?
- What does it take to have black and white rectangles drawed in an element I could embed on a larger HTML document?
- Where could we find samples and specifications for that, so that even newbies like me could remodel the function previously posted?
Thank you very much!
|
|
07-31-2012, 03:35 PM
|
|
Contributor
* Expert *
|
|
Join Date: Feb 2004
Posts: 522
|
|
re: canvas barcode generation questions
Quote:
|
Originally Posted by VBobCat
If the HTML document containing the SVG graphic is shown inside my application, in a WebBrowser control, made with .NET Framework 4.0, will it depend on the version of IE installed on each computer?
|
I have not worked with the WebBrowser in .Net to know if this is definitely the case, but think it is probable.
Quote:
|
Originally Posted by VBobCat
HTML5... is it as simple as SVG?
|
The HTML5 spec is huge, but the code for drawing on the canvas is only one part of it.
Quote:
|
Originally Posted by VBobCat
What does it take to have black and white rectangles drawed in an element I could embed on a larger HTML document?
|
This tutorial will guide you through drawing a black rect on a canvas element
(drawing a white color rect is the same what just a different color name,
but it you use white as the background color then
white is the color of the spacing between the black rects
which might end up saving some drawing commands).
However, you shouldn't stop there because there are many many pages of canvas tutorials like this one.
Here is a nice sample page (and proof that the canvas does do bar codes interactively).
JavaScript plugins are not like browser plugins.
There are basically a code module that is reference in your HTML code and then all the functions
of the plugin become available within a few HTML script tags.
This page shows the output of the JQuery Barcode plugin
and this page has the code download and this page gives some further info.
There's also an interactive demo page for the plugin.
Oh and you haven't brought up WPF, but I know someone who finds this thread
may be looking for such code (C#.Net, not VB.Net, but it's translatable).
Another open source C#.Net WPF Barcode implementation has a sourceforge page here and a project page here.
Since this is the first thread where I've addressed .Net barcode generation I also through in a few extra links
CodeProject Advanced Barcode Generation System for Code 39
Barcode Rendering Framework (says that it includes:
"A sample web application is included to demonstrate usage of the rendering classes from a web environment").
(mostly Avery label print oriented)
Since this thread has mentioned "XML" "json" and "canvas",
I'll add a link for this interactive demo page.
I know someone is going to be say what about ASP.Net?
..what about using Web Sockets?
They also can use the HTML 5 canvas:
CodeProject: Fun with HTML5 Canvas, WebSocket, JQuery and ASP.NET |
Last edited by hDC_0; 07-31-2012 at 04:21 PM.
|
07-31-2012, 04:15 PM
|
|
Freshman
|
|
Join Date: Aug 2009
Location: São Paulo, Brazil
Posts: 29
|
|
Wow, thanks a lot!
I'm sure all this information will be useful for a lot of people.
But then again, thanks to the interactive demo page you kindly pointed, I will try to remodel my function in order to draw barcodes based only in CSS-styled DIV elements.
This is because any solution depending on scripts will halt upon a security warning in IE browser, when my users open the .html files stored locally. Even if users can easily authorize the execution of the script, I'll have to deal with users that don't have the faintest idea of what is that happening, and that will be a constant bother.
So, the CSS solutions sounds perfect for me. As soon as I manage to rewrite that function, I'll post it here. I also want to adapt it for Code 128, which produces more compact codes if only 0-9 digits are involved, which is my case.
Once more, thank you very much for your kind and fast attention to my question! |
|
|
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
|
|
|
| Thread Tools |
|
|
| Display Modes |
 Linear Mode
|
Posting Rules
|
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts
HTML code is Off
|
|
|
|
|
|
|
|
 |
|
