条码Code 39javascript编码
Barcode Code 39 javascript encoding
我正在尝试通过修改一些 D3 javascript 来编码代码 39 条码。
问题是我不明白 code 39 条码是如何编码的。看起来他们使用 12 位二进制来编码字符。
如何将像“598649”这样的字符串解码为等效的 12 位二进制文件,最好使用 D3.js?
characters = {
'100100100101': '$',
'100100101001': '/',
'100101001001': '+',
'100101011011': '-',
'100101101011': 'X',
'100101101101': '*',
'100110101011': 'V',
'100110101101': ' ',
'100110110101': 'Z',
'101001001001': '%',
'101001011011': '7',
'101001101011': '4',
'101001101101': '0',
'101010011011': 'G',
'101010110011': 'Q',
'101011001011': 'D',
'101011001101': 'J',
'101011010011': 'N',
'101011011001': 'T',
'101100101011': '2',
'101100101101': '9',
'101100110101': '6',
'101101001011': 'B',
'101101001101': 'I',
'101101010011': 'L',
'101101011001': 'S',
'101101100101': 'F',
'101101101001': 'P',
'110010101011': 'U',
'110010101101': '0',
'110010110101': 'Y',
'110011010101': 'W',
'110100101011': '1',
'110100101101': '8',
'110100110101': '5',
'110101001011': 'A',
'110101001101': 'H',
'110101010011': 'K',
'110101011001': 'R',
'110101100101': 'E',
'110101101001': 'O',
'110110010101': '3',
'110110100101': 'C',
'110110101001': 'M',
}
这是我目前使用的一些代码。之前的代码是生成随机二进制文件然后将键与值匹配。我想做相反的事情,所以我不确定是否应该创建第二个 key/values 反转的数组。
//var num= prompt("Enter num")
//console.log(parseInt(num, 10).toString(2))
//var decnum=892938
//alert(decnum.toString(2))
// var b = parseInt( a, 2 )
// var str = '34566'
// var found = str.match(/[01]{12}/g).map(['110100101101','101100101101', '101100101011', '101100101101', '110110010101', '110100101101'])
//str.match(/[01]{12}/g).map(characters)
//console.log(characters[v])
//console.log(found)
var str = ['110100101101','101100101101', '101100101011', '101100101101', '110110010101', '110100101101']
//var barcode_array = str.match(/[01]{12}/g).map(Object.keys(characters))
//console.log(barcode_array)
//split into array
var barcode_input = ['110100101101','101100101101', '101100101011', '101100101101', '110110010101', '110100101101']
//map to binary characters
//console.log(barcode_input.range(Object.keys(characters)))
这是 Fiddle
https://jsfiddle.net/6szmwkgm/6/
代码修改自 Christopher Manning http://bl.ocks.org/christophermanning/4324236
作为参考,这是另一个代码 39 脚本 http://notionovus.com/blog/code-39-barcode-biscuits/
您正在构建的编码可以通过使用 characters
对象作为简单查找 table 来完成。获取每个字符并查找它的线条模式,构建这些字符的数组然后处理它们。
您正在处理的代码比您似乎需要做的工作多得多。我用它作为起点,然后将其削减到最低限度。
注意,我手头没有扫描仪来测试这个,所以如果它给你带来任何麻烦,请告诉我。
这是一个注释代码片段:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
<style type="text/css">
body {
display: block;
margin: 0;
background-color: #FFF;
}
text {
font-family: monospace;
font-size: 1.5em;
text-anchor: middle;
}
path {
fill-opacity: 0;
}
</style>
</head>
<body>
<script type="text/javascript">
var svg = d3.select("body")
.append("svg")
.attr("width", 300)
.attr("height", 300);
// input barcode
var barcode = "598649";
// some configuration items
var config = {
"height": 100,
"x": 10,
"margin": 20
};
// map each character to it's pattern
// note I reversed it from the sample
// to make lookups on each letter easier
var characters = {
"0": "110010101101",
" ": "100110101101",
"1": "110100101011",
"2": "101100101011",
"3": "110110010101",
"4": "101001101011",
"5": "110100110101",
"6": "101100110101",
"7": "101001011011",
"8": "110100101101",
"9": "101100101101",
"$": "100100100101",
"%": "101001001001",
"*": "100101101101",
"+": "100101001001",
"-": "100101011011",
"/": "100100101001",
"A": "110101001011",
"B": "101101001011",
"C": "110110100101",
"D": "101011001011",
"E": "110101100101",
"F": "101101100101",
"G": "101010011011",
"H": "110101001101",
"I": "101101001101",
"J": "101011001101",
"K": "110101010011",
"L": "101101010011",
"M": "110110101001",
"N": "101011010011",
"O": "110101101001",
"P": "101101101001",
"Q": "101010110011",
"R": "110101011001",
"S": "101101011001",
"T": "101011011001",
"U": "110010101011",
"V": "100110101011",
"W": "110011010101",
"X": "100101101011",
"Y": "110010110101",
"Z": "100110110101"
};
// build you data array
var data = [];
// Code 39 barcodes start with a *
data.push('100101101101');
barcode.split("").forEach(function(d, i) {
// for each character, append the patter to our array
data.push(characters[d]); //<-- look up for each character
});
// Code 39 barcodes end with a *
data.push('100101101101');
// set up line function
var line = d3.svg.line()
.x(function(d) {
return d.cx = d.x
})
.y(function(d) {
return d.cy = d.y
})
// group all the barcode paths
var g = svg.append('g')
.attr('class', 'barcode');
// set up the data attributes necessary
var path = g.selectAll('path')
.data(data.map(function(c) {
return c + '0' // put a space between each character
}).join('').split('')
.map(function(d, i) {
return [{
c: d,
x: config['margin']+ (i * 1.2),
y: config['margin']
}, {
c: d,
x: config['margin'] + (i * 1.2),
y: config['margin'] + config['height']
}]
})
);
path.enter()
.append('path');
// draw the barcode
path
.style("stroke", function(d) {
return d[0].c == '1' ? '#000' : '#FFF'
})
.style("stroke-width", 1.2)
.attr("d", line);
path.exit().remove();
// add the text underneath
var text = svg.selectAll('text')
.data([barcode])
text.exit().remove();
text.enter()
.append('text');
text
.text(barcode)
.style('fill', 'black')
.attr('y', config.margin + config.height + 15)
.attr('x', g.node().getBBox().width/2 + config.margin);
</script>
</body>
</html>
我正在尝试通过修改一些 D3 javascript 来编码代码 39 条码。
问题是我不明白 code 39 条码是如何编码的。看起来他们使用 12 位二进制来编码字符。
如何将像“598649”这样的字符串解码为等效的 12 位二进制文件,最好使用 D3.js?
characters = {
'100100100101': '$',
'100100101001': '/',
'100101001001': '+',
'100101011011': '-',
'100101101011': 'X',
'100101101101': '*',
'100110101011': 'V',
'100110101101': ' ',
'100110110101': 'Z',
'101001001001': '%',
'101001011011': '7',
'101001101011': '4',
'101001101101': '0',
'101010011011': 'G',
'101010110011': 'Q',
'101011001011': 'D',
'101011001101': 'J',
'101011010011': 'N',
'101011011001': 'T',
'101100101011': '2',
'101100101101': '9',
'101100110101': '6',
'101101001011': 'B',
'101101001101': 'I',
'101101010011': 'L',
'101101011001': 'S',
'101101100101': 'F',
'101101101001': 'P',
'110010101011': 'U',
'110010101101': '0',
'110010110101': 'Y',
'110011010101': 'W',
'110100101011': '1',
'110100101101': '8',
'110100110101': '5',
'110101001011': 'A',
'110101001101': 'H',
'110101010011': 'K',
'110101011001': 'R',
'110101100101': 'E',
'110101101001': 'O',
'110110010101': '3',
'110110100101': 'C',
'110110101001': 'M',
}
这是我目前使用的一些代码。之前的代码是生成随机二进制文件然后将键与值匹配。我想做相反的事情,所以我不确定是否应该创建第二个 key/values 反转的数组。
//var num= prompt("Enter num")
//console.log(parseInt(num, 10).toString(2))
//var decnum=892938
//alert(decnum.toString(2))
// var b = parseInt( a, 2 )
// var str = '34566'
// var found = str.match(/[01]{12}/g).map(['110100101101','101100101101', '101100101011', '101100101101', '110110010101', '110100101101'])
//str.match(/[01]{12}/g).map(characters)
//console.log(characters[v])
//console.log(found)
var str = ['110100101101','101100101101', '101100101011', '101100101101', '110110010101', '110100101101']
//var barcode_array = str.match(/[01]{12}/g).map(Object.keys(characters))
//console.log(barcode_array)
//split into array
var barcode_input = ['110100101101','101100101101', '101100101011', '101100101101', '110110010101', '110100101101']
//map to binary characters
//console.log(barcode_input.range(Object.keys(characters)))
这是 Fiddle https://jsfiddle.net/6szmwkgm/6/
代码修改自 Christopher Manning http://bl.ocks.org/christophermanning/4324236 作为参考,这是另一个代码 39 脚本 http://notionovus.com/blog/code-39-barcode-biscuits/
您正在构建的编码可以通过使用 characters
对象作为简单查找 table 来完成。获取每个字符并查找它的线条模式,构建这些字符的数组然后处理它们。
您正在处理的代码比您似乎需要做的工作多得多。我用它作为起点,然后将其削减到最低限度。
注意,我手头没有扫描仪来测试这个,所以如果它给你带来任何麻烦,请告诉我。
这是一个注释代码片段:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
<style type="text/css">
body {
display: block;
margin: 0;
background-color: #FFF;
}
text {
font-family: monospace;
font-size: 1.5em;
text-anchor: middle;
}
path {
fill-opacity: 0;
}
</style>
</head>
<body>
<script type="text/javascript">
var svg = d3.select("body")
.append("svg")
.attr("width", 300)
.attr("height", 300);
// input barcode
var barcode = "598649";
// some configuration items
var config = {
"height": 100,
"x": 10,
"margin": 20
};
// map each character to it's pattern
// note I reversed it from the sample
// to make lookups on each letter easier
var characters = {
"0": "110010101101",
" ": "100110101101",
"1": "110100101011",
"2": "101100101011",
"3": "110110010101",
"4": "101001101011",
"5": "110100110101",
"6": "101100110101",
"7": "101001011011",
"8": "110100101101",
"9": "101100101101",
"$": "100100100101",
"%": "101001001001",
"*": "100101101101",
"+": "100101001001",
"-": "100101011011",
"/": "100100101001",
"A": "110101001011",
"B": "101101001011",
"C": "110110100101",
"D": "101011001011",
"E": "110101100101",
"F": "101101100101",
"G": "101010011011",
"H": "110101001101",
"I": "101101001101",
"J": "101011001101",
"K": "110101010011",
"L": "101101010011",
"M": "110110101001",
"N": "101011010011",
"O": "110101101001",
"P": "101101101001",
"Q": "101010110011",
"R": "110101011001",
"S": "101101011001",
"T": "101011011001",
"U": "110010101011",
"V": "100110101011",
"W": "110011010101",
"X": "100101101011",
"Y": "110010110101",
"Z": "100110110101"
};
// build you data array
var data = [];
// Code 39 barcodes start with a *
data.push('100101101101');
barcode.split("").forEach(function(d, i) {
// for each character, append the patter to our array
data.push(characters[d]); //<-- look up for each character
});
// Code 39 barcodes end with a *
data.push('100101101101');
// set up line function
var line = d3.svg.line()
.x(function(d) {
return d.cx = d.x
})
.y(function(d) {
return d.cy = d.y
})
// group all the barcode paths
var g = svg.append('g')
.attr('class', 'barcode');
// set up the data attributes necessary
var path = g.selectAll('path')
.data(data.map(function(c) {
return c + '0' // put a space between each character
}).join('').split('')
.map(function(d, i) {
return [{
c: d,
x: config['margin']+ (i * 1.2),
y: config['margin']
}, {
c: d,
x: config['margin'] + (i * 1.2),
y: config['margin'] + config['height']
}]
})
);
path.enter()
.append('path');
// draw the barcode
path
.style("stroke", function(d) {
return d[0].c == '1' ? '#000' : '#FFF'
})
.style("stroke-width", 1.2)
.attr("d", line);
path.exit().remove();
// add the text underneath
var text = svg.selectAll('text')
.data([barcode])
text.exit().remove();
text.enter()
.append('text');
text
.text(barcode)
.style('fill', 'black')
.attr('y', config.margin + config.height + 15)
.attr('x', g.node().getBBox().width/2 + config.margin);
</script>
</body>
</html>