UNPKG

@towavephone/react-watermark-component

Version:

react-watermark-component is a component that can generate a water mark background image.

50 lines (42 loc) 6.02 kB
'use strict'; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = getWaterMarkCanvas; function getWaterMarkCanvas(text, options) { var canvas = document.createElement('canvas'); var ctx = canvas.getContext('2d'); var canvasWidth = options.chunkWidth; var canvasHeight = options.chunkHeight; canvas.width = canvasWidth; canvas.height = canvasHeight; ctx.textAlign = options.textAlign; ctx.textBaseline = options.textBaseline; ctx.globalAlpha = options.globalAlpha; ctx.font = options.font; ctx.translate(canvasWidth / 2, canvasHeight / 2); ctx.rotate(options.rotateAngle); ctx.translate(-canvasWidth / 2 * 1.2, -canvasHeight / 2 * 1.2); ctx.fillStyle = options.fillStyle; var waterMarkText = []; var chunkWidth = options.chunkWidth; var chunkHeight = options.chunkHeight; var horizontalChunkCount = Math.ceil(canvasWidth / chunkWidth) + 1; var verticalChunkCount = Math.ceil(canvasHeight / chunkHeight) + 1; for (var j = 0, initY = chunkHeight / 2, indent = 0; j <= verticalChunkCount; j += 1) { indent = parseInt(j % 2); for (var i = 0, initX = chunkWidth / 2; i <= horizontalChunkCount; i += 1) { waterMarkText.push({ text: text, x: i * chunkWidth + indent * initX, y: j * chunkHeight + initY }); } } waterMarkText.forEach(function (item) { ctx.fillText(item.text, item.x, item.y); }); return ctx.canvas.toDataURL(); } module.exports = exports['default']; //# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uL3NyYy9XYXRlck1hcmtDYW52YXMuanMiXSwibmFtZXMiOlsiZ2V0V2F0ZXJNYXJrQ2FudmFzIiwidGV4dCIsIm9wdGlvbnMiLCJjYW52YXMiLCJkb2N1bWVudCIsImNyZWF0ZUVsZW1lbnQiLCJjdHgiLCJnZXRDb250ZXh0IiwiY2FudmFzV2lkdGgiLCJjaHVua1dpZHRoIiwiY2FudmFzSGVpZ2h0IiwiY2h1bmtIZWlnaHQiLCJ3aWR0aCIsImhlaWdodCIsInRleHRBbGlnbiIsInRleHRCYXNlbGluZSIsImdsb2JhbEFscGhhIiwiZm9udCIsInRyYW5zbGF0ZSIsInJvdGF0ZSIsInJvdGF0ZUFuZ2xlIiwiZmlsbFN0eWxlIiwid2F0ZXJNYXJrVGV4dCIsImhvcml6b250YWxDaHVua0NvdW50IiwiTWF0aCIsImNlaWwiLCJ2ZXJ0aWNhbENodW5rQ291bnQiLCJqIiwiaW5pdFkiLCJpbmRlbnQiLCJwYXJzZUludCIsImkiLCJpbml0WCIsInB1c2giLCJ4IiwieSIsImZvckVhY2giLCJpdGVtIiwiZmlsbFRleHQiLCJ0b0RhdGFVUkwiXSwibWFwcGluZ3MiOiI7Ozs7O2tCQUF3QkEsa0I7QUFBVCxTQUFTQSxrQkFBVCxDQUE0QkMsSUFBNUIsRUFBa0NDLE9BQWxDLEVBQTJDO0FBQ3hELE1BQU1DLFNBQVNDLFNBQVNDLGFBQVQsQ0FBdUIsUUFBdkIsQ0FBZjtBQUNBLE1BQU1DLE1BQU1ILE9BQU9JLFVBQVAsQ0FBa0IsSUFBbEIsQ0FBWjtBQUNBLE1BQU1DLGNBQWNOLFFBQVFPLFVBQTVCO0FBQ0EsTUFBTUMsZUFBZVIsUUFBUVMsV0FBN0I7QUFDQVIsU0FBT1MsS0FBUCxHQUFlSixXQUFmO0FBQ0FMLFNBQU9VLE1BQVAsR0FBZ0JILFlBQWhCO0FBQ0FKLE1BQUlRLFNBQUosR0FBZ0JaLFFBQVFZLFNBQXhCO0FBQ0FSLE1BQUlTLFlBQUosR0FBbUJiLFFBQVFhLFlBQTNCO0FBQ0FULE1BQUlVLFdBQUosR0FBa0JkLFFBQVFjLFdBQTFCO0FBQ0FWLE1BQUlXLElBQUosR0FBV2YsUUFBUWUsSUFBbkI7O0FBRUFYLE1BQUlZLFNBQUosQ0FBY1YsY0FBYyxDQUE1QixFQUErQkUsZUFBZSxDQUE5QztBQUNBSixNQUFJYSxNQUFKLENBQVdqQixRQUFRa0IsV0FBbkI7O0FBRUFkLE1BQUlZLFNBQUosQ0FBYyxDQUFDVixXQUFELEdBQWUsQ0FBZixHQUFtQixHQUFqQyxFQUFzQyxDQUFDRSxZQUFELEdBQWdCLENBQWhCLEdBQW9CLEdBQTFEO0FBQ0FKLE1BQUllLFNBQUosR0FBZ0JuQixRQUFRbUIsU0FBeEI7O0FBRUEsTUFBTUMsZ0JBQWdCLEVBQXRCO0FBQ0EsTUFBTWIsYUFBYVAsUUFBUU8sVUFBM0I7QUFDQSxNQUFNRSxjQUFjVCxRQUFRUyxXQUE1QjtBQUNBLE1BQU1ZLHVCQUF1QkMsS0FBS0MsSUFBTCxDQUFVakIsY0FBY0MsVUFBeEIsSUFBc0MsQ0FBbkU7QUFDQSxNQUFNaUIscUJBQXFCRixLQUFLQyxJQUFMLENBQVVmLGVBQWVDLFdBQXpCLElBQXdDLENBQW5FOztBQUVBLE9BQUssSUFBSWdCLElBQUksQ0FBUixFQUFXQyxRQUFRakIsY0FBYyxDQUFqQyxFQUFvQ2tCLFNBQVMsQ0FBbEQsRUFBcURGLEtBQUtELGtCQUExRCxFQUE4RUMsS0FBSyxDQUFuRixFQUFzRjtBQUNwRkUsYUFBU0MsU0FBU0gsSUFBSSxDQUFiLENBQVQ7O0FBRUEsU0FBSyxJQUFJSSxJQUFJLENBQVIsRUFBV0MsUUFBUXZCLGFBQWEsQ0FBckMsRUFBd0NzQixLQUFLUixvQkFBN0MsRUFBbUVRLEtBQUssQ0FBeEUsRUFBMkU7QUFDekVULG9CQUFjVyxJQUFkLENBQW1CO0FBQ2pCaEMsa0JBRGlCO0FBRWpCaUMsV0FBR0gsSUFBSXRCLFVBQUosR0FBaUJvQixTQUFTRyxLQUZaO0FBR2pCRyxXQUFHUixJQUFJaEIsV0FBSixHQUFrQmlCO0FBSEosT0FBbkI7QUFLRDtBQUNGOztBQUVETixnQkFBY2MsT0FBZCxDQUFzQixVQUFDQyxJQUFELEVBQVU7QUFDOUIvQixRQUFJZ0MsUUFBSixDQUFhRCxLQUFLcEMsSUFBbEIsRUFBd0JvQyxLQUFLSCxDQUE3QixFQUFnQ0csS0FBS0YsQ0FBckM7QUFDRCxHQUZEOztBQUlBLFNBQU83QixJQUFJSCxNQUFKLENBQVdvQyxTQUFYLEVBQVA7QUFDRCIsImZpbGUiOiJXYXRlck1hcmtDYW52YXMuanMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgZGVmYXVsdCBmdW5jdGlvbiBnZXRXYXRlck1hcmtDYW52YXModGV4dCwgb3B0aW9ucykge1xuICBjb25zdCBjYW52YXMgPSBkb2N1bWVudC5jcmVhdGVFbGVtZW50KCdjYW52YXMnKVxuICBjb25zdCBjdHggPSBjYW52YXMuZ2V0Q29udGV4dCgnMmQnKVxuICBjb25zdCBjYW52YXNXaWR0aCA9IG9wdGlvbnMuY2h1bmtXaWR0aFxuICBjb25zdCBjYW52YXNIZWlnaHQgPSBvcHRpb25zLmNodW5rSGVpZ2h0XG4gIGNhbnZhcy53aWR0aCA9IGNhbnZhc1dpZHRoXG4gIGNhbnZhcy5oZWlnaHQgPSBjYW52YXNIZWlnaHRcbiAgY3R4LnRleHRBbGlnbiA9IG9wdGlvbnMudGV4dEFsaWduXG4gIGN0eC50ZXh0QmFzZWxpbmUgPSBvcHRpb25zLnRleHRCYXNlbGluZVxuICBjdHguZ2xvYmFsQWxwaGEgPSBvcHRpb25zLmdsb2JhbEFscGhhXG4gIGN0eC5mb250ID0gb3B0aW9ucy5mb250XG5cbiAgY3R4LnRyYW5zbGF0ZShjYW52YXNXaWR0aCAvIDIsIGNhbnZhc0hlaWdodCAvIDIpXG4gIGN0eC5yb3RhdGUob3B0aW9ucy5yb3RhdGVBbmdsZSlcblxuICBjdHgudHJhbnNsYXRlKC1jYW52YXNXaWR0aCAvIDIgKiAxLjIsIC1jYW52YXNIZWlnaHQgLyAyICogMS4yKVxuICBjdHguZmlsbFN0eWxlID0gb3B0aW9ucy5maWxsU3R5bGVcblxuICBjb25zdCB3YXRlck1hcmtUZXh0ID0gW11cbiAgY29uc3QgY2h1bmtXaWR0aCA9IG9wdGlvbnMuY2h1bmtXaWR0aFxuICBjb25zdCBjaHVua0hlaWdodCA9IG9wdGlvbnMuY2h1bmtIZWlnaHRcbiAgY29uc3QgaG9yaXpvbnRhbENodW5rQ291bnQgPSBNYXRoLmNlaWwoY2FudmFzV2lkdGggLyBjaHVua1dpZHRoKSArIDFcbiAgY29uc3QgdmVydGljYWxDaHVua0NvdW50ID0gTWF0aC5jZWlsKGNhbnZhc0hlaWdodCAvIGNodW5rSGVpZ2h0KSArIDFcblxuICBmb3IgKGxldCBqID0gMCwgaW5pdFkgPSBjaHVua0hlaWdodCAvIDIsIGluZGVudCA9IDA7IGogPD0gdmVydGljYWxDaHVua0NvdW50OyBqICs9IDEpIHtcbiAgICBpbmRlbnQgPSBwYXJzZUludChqICUgMilcblxuICAgIGZvciAobGV0IGkgPSAwLCBpbml0WCA9IGNodW5rV2lkdGggLyAyOyBpIDw9IGhvcml6b250YWxDaHVua0NvdW50OyBpICs9IDEpIHtcbiAgICAgIHdhdGVyTWFya1RleHQucHVzaCh7XG4gICAgICAgIHRleHQsXG4gICAgICAgIHg6IGkgKiBjaHVua1dpZHRoICsgaW5kZW50ICogaW5pdFgsXG4gICAgICAgIHk6IGogKiBjaHVua0hlaWdodCArIGluaXRZXG4gICAgICB9KVxuICAgIH1cbiAgfVxuXG4gIHdhdGVyTWFya1RleHQuZm9yRWFjaCgoaXRlbSkgPT4ge1xuICAgIGN0eC5maWxsVGV4dChpdGVtLnRleHQsIGl0ZW0ueCwgaXRlbS55KVxuICB9KVxuXG4gIHJldHVybiBjdHguY2FudmFzLnRvRGF0YVVSTCgpXG59XG4iXX0=