Question

我无法将其限制在一个非常具体的时间范围内，除非知道在过去一个月左右，Chrome中的内容发生了变化，因此当我从Chrome浏览器打印时，文本和其他项目变得不可更改且不连贯打印出来的时候。从其他任何东西打印时，相同的文档都很棒。文档在对话框中看起来很棒，但是当它打印到页面时，它看起来很糟糕。

我在我的javascript中启动了打印。
实际上我打印的base64图像看起来很糟糕。
我打印到热敏打印机。
打印页面上的条形码不稳定。
文字有些难以理解。
一个月前工作完美。

Answer 1

我们最近遇到了这个问题。我们看到一些解决方案，我认为帆布是一个很好的解决方案。

替代解决方案：使用javascript画布解决此问题。

我在codePen中创建了一个代码，用于所有浏览器：

https://codepen.io/eltonsrc/pen/OpXyrQ

<强> HTML ：

<div style="width: 600px">
  <canvas id="barcode" class="barcode">
    Code for browsers without canvas support. For example:
    <img src="blackBar.gif" width="1" height="50">
    <img src="whiteBar.gif" width="1" height="50">
  </canvas>
</div>

<强> CSS ：

.barcode {
  width: 100%;
  height: 50px;
}

<强>的Javascript ：

var barCode = (function (){
  this.WHITE = 'rgb(255, 255, 255)';
  this.BLACK = 'rgb(0, 0, 0)';
  this.THIN_BAR = 1;
  this.THICK_BAR = 3;

  this.lastPixel = 0;

  this.drawBar = function (barWidth, color) {
    this.ctx.fillStyle = color;
    this.ctx.fillRect(this.lastPixel, 0, barWidth, this.canvas.height);
    this.lastPixel += barWidth;
  };

  this.draw2of5BarCode = function (barcodeNumber) {
    var barCodes = ['00110', '10001', '01001', '11000', '00101', '10100', '01100', '00011', '10010', '01010'];

    for (var f1 = 9; f1 >= 0; f1--) {
      for (var f2 = 9; f2 >= 0; f2--) {
        var f = f1 * 10 + f2;
        var texto = '';
        for (var i = 0; i < 5; i++) {
          texto += barCodes[f1].substr(i, 1) + barCodes[f2].substr(i, 1);
        }
        barCodes[f] = texto;
      }
    }

    // begin of barcode
    this.drawBar(this.THIN_BAR, this.BLACK);
    this.drawBar(this.THIN_BAR, this.WHITE);
    this.drawBar(this.THIN_BAR, this.BLACK);
    this.drawBar(this.THIN_BAR, this.WHITE);

    if (barcodeNumber.length % 2 != 0) {
      barcodeNumber = '0' + barcodeNumber;
    }

    do {
      var i = Number(barcodeNumber.substr(0, 2));
      if (barcodeNumber.length == 2) {
        barcodeNumber = '';
      } else {
        barcodeNumber = barcodeNumber.substr(2, barcodeNumber.length - 2);
      }

      var f = barCodes[i];

      for (i = 0; i < 10; i += 2) {
        if (f.substr(i, 1) == '0') {
          this.drawBar(this.THIN_BAR, this.BLACK);
        } else {
          this.drawBar(this.THICK_BAR, this.BLACK);
        }

        if (f.substr(i + 1, 1) == '0') {
          this.drawBar(this.THIN_BAR, this.WHITE);
        } else {
          this.drawBar(this.THICK_BAR, this.WHITE);
        }
      }
    } while(barcodeNumber.length > 0);

    this.drawBar(this.THICK_BAR, this.BLACK);
    this.drawBar(this.THIN_BAR, this.WHITE);
    this.drawBar(this.THIN_BAR, this.BLACK);
  }

  this.drawBarcode = function (canvasId, barcodeNumber) {
    this.canvas = document.getElementById(canvasId);

    // verify canvas support
    if (!this.canvas.getContext) {
      return;
    }

    this.lastPixel = 0;
    this.ctx = this.canvas.getContext('2d');
    this.draw2of5BarCode(barcodeNumber);
  };

  return this;
})();

barCode.drawBarcode('barcode', '856000000005227702201707619934651263800000000003');

最新的Chrome更新和打印搞砸了？

1 个答案: