使用jsbarcode生成条形码
安装
yarn add jsbarcode
使用
// HTMLElement 承载条形码的元素 svg/canvas
// text 显示在条形码下方的文字
// option 条形码的配置项 具体见【条形码的配置项】
JsBarcode(HTMLElement, text, option)
条形码的配置项
使用中的option
background: "#ffffff" // 背景色
displayValue: true // 是否显示条形码下面的文字
font: "monospace" // 字体
fontOptions: "" // 字体相关的配置
fontSize: 20 // 字体大小 默认20
format: "CODE128" // 条形码的种类 具体见 format
height: 40 // 高度
lineColor: "#000000" // 条形码线条的颜色
margin: 8 // 条形码四种的间距 类似于div的padding
marginBottom: 8 // 下边距
marginLeft: 8 // 左边距
marginRight: 8 // 右边距
marginTop: 8 // 上边距
text: undefined
textAlign: "center" // 条形码下面的文字的对齐方式
textMargin: 2
textPosition: "bottom" // 条形码下面文字的位置
条形码的种类
条形码的配置项选项中的format的值
CODE128
CODE128 (自动模式切换)
CODE128 A/B/C (强制模式)
EAN
EAN-13
EAN-8
EAN-5
EAN-2
UPC (A)
CODE39
ITF-14
MSI
MSI10
MSI11
MSI1010
MSI1110
Pharmacode
Codabar
使用jsbarcode生成条形码的更多相关文章
- 前端如何生成条形码---JsBarcode
React 生成条形码代码 注:需引入 jsbarcode 插件 import React from 'react'; import JsBarcode from 'jsbarcode'; class ...
- 生成条形码插件 条形码--JsBarcode
每天学习一点点 编程PDF电子书免费下载: http://www.shitanlife.com/code 介绍一下在GitHub生成条形码的js插件→JsBarcode 条码支持的有: CODE128 ...
- js生成条形码——JsBarcode
原文地址:https://www.cnblogs.com/huangenai/p/6347607.html 介绍一下在GitHub生成条形码的js插件→JsBarcode 条码支持的有: CODE12 ...
- js自动生成条形码插件-JsBarcode
JsBarcode.html <!DOCTYPE html> <html lang="en"> <head> <meta charset= ...
- js生成条形码插件
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 使用js生成条形码以及二维码
一.用js生成条形码这种业务场景不是很常见的,最近刚好又接到这种需求 Google一下,发现github还真有这方面的轮子,感谢github,省去了我们很多造轮子的过程, 好了言归正传,首先引入jsb ...
- js生成条形码
生成条形码 <body> <div> <img id="ma"/> </div> </body> </html&g ...
- react 中使用 JsBarcode 显示条形码
import React from 'react';import JsBarcode from 'jsbarcode'; export class RefundSheet extends React. ...
- C# 在Word文档中生成条形码
C# 在Word文档中生成条形码 简介 条形码是由多个不同的空白和黑条按照一定的顺序组成,用于表示各种信息如产品名称.制造商.类别.价格等.目前,条形码在我们的日常生活中有着很广泛的应用,不管是在图书 ...
- 使用html2canvas实现批量生成条形码
/*前台代码*/ <%@ Page Language="C#" AutoEventWireup="true" CodeFile="Generat ...
随机推荐
- 将Map中对应的key和value赋值到对象中
BeanUtils位于import org.apache.commons.beanutils.BeanUtils包下 其使用方法: Map<String, Object> objectMa ...
- IE8页面失去焦点，动态删除element
当页面失去焦点(切换到其他标签页 / 切换到其他软件),触发失焦事件,然后动态删除element 兼容IE8 if(window.ActiveXObject){ window.attachEvent( ...
- 重学c#系列——索引器(十)
前言 对于索引器,我们肯定不会陌生.为什么会有索引器这个东西呢?我们发现这东西很像是属性,只是通过索引方式去调用,那就慢慢揭开他的面纱吧. 正文 假设我们要对外暴露一个数组,为了体现其封装性,我们使用 ...
- sweetviz工具避坑和简单使用
网上关于sweetviz的文章比较少,有些坑这里说一下给大家避坑. 使用sweetviz遇到的错误如下: KeyError: "None of ['index'] are in the co ...
- ImageJ软件使用教程（二）：图像测量
目录 图像比例尺 加载图像 设置比例尺 标注比例尺 测量长度面积 测量长度 测量面积 参考资料 图像比例尺 使用ImageJ软件测量图像中的长度.面积等信息时,需要先设置图像的比例尺,比例尺用于将图像 ...
- 力扣442(java)-数组中重复的数据（中等）
题目: 给你一个长度为 n 的整数数组 nums ,其中 nums 的所有整数都在范围 [1, n] 内,且每个整数出现 一次 或 两次 .请你找出所有出现 两次 的整数,并以数组形式返回. 你必须设 ...
- 力扣38(java)-外观数列（中等）
题目: 给定一个正整数 n ,输出外观数列的第 n 项. 「外观数列」是一个整数序列,从数字 1 开始,序列中的每一项都是对前一项的描述. 你可以将其视作是由递归公式定义的数字字符串序列: count ...
- Sentinel 1.7.2 发布，完善开源生态及扩展性
多样化的适配模块 到目前为止,Sentinel 已覆盖微服务.API Gateway 和 Service Mesh 三大板块的核心生态,同时多语言已推出 Java.C++.Go 三种语言的原生实现. ...
- OPLG：新一代云原生可观测最佳实践
简介:OPLG 体系拥有成熟且富有活力的开源社区生态,同时也经过了大量企业生产环境的实践检验,是当下建设新一代云原生统一可观测平台的热门选择.但是,OPLG 只是提供了一个技术体系,如何灵活运用,解 ...
- 基于SLS构建RDS审计合规监控
简介: 数据库是企业业务的数据核心,其安全方面的问题在传统环境中已经成为泄漏和被篡改的重要根源.因此,对数据库的操作行为尤其是全量 SQL 执行记录的审计日志,就显得尤为重要. 背景 数据库是企业业务 ...