Created
January 9, 2018 16:04
-
-
Save jan-j/15a7768a1962753721b509f5c6b9efc8 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const path = require('path'); | |
const fs = require('fs'); | |
const Canvas = require('canvas'); | |
const targetWidth = 6000; | |
const targetHeight = 50; | |
const deltaX = 50; | |
const sourceWidth = deltaX * 20 | |
const sourceHeight = targetHeight * 20; | |
const sourceCanvas = new Canvas(sourceWidth, sourceHeight); | |
sourceCanvas.getContext('2d').fillStyle = 'red'; | |
sourceCanvas.getContext('2d').fillRect(0, 0, sourceWidth, sourceHeight); | |
const targetCanvas = new Canvas(targetWidth, targetHeight); | |
targetCanvas.getContext('2d').fillStyle = 'blue'; | |
targetCanvas.getContext('2d').fillRect(0, 0, targetWidth, targetHeight); | |
for (let x = 0; x < targetWidth; x = x + deltaX) { | |
targetCanvas.getContext('2d').drawImage( | |
sourceCanvas, | |
0, | |
0, | |
sourceWidth, | |
sourceHeight, | |
x, | |
0, | |
deltaX, | |
targetHeight | |
); | |
} | |
fs.writeFileSync( | |
path.join(__dirname, 'target.png'), | |
new Buffer( | |
targetCanvas.toDataURL('image/png').replace(/^data.*?;base64,/, ''), | |
'base64' | |
) | |
); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const path = require('path'); | |
const fs = require('fs'); | |
const { createCanvas } = require('canvas'); | |
const targetWidth = 6000; | |
const targetHeight = 50; | |
const deltaX = 50; | |
const sourceWidth = deltaX * 20 | |
const sourceHeight = targetHeight * 20; | |
const sourceCanvas = createCanvas(sourceWidth, sourceHeight); | |
sourceCanvas.getContext('2d').fillStyle = 'red'; | |
sourceCanvas.getContext('2d').fillRect(0, 0, sourceWidth, sourceHeight); | |
const targetCanvas = createCanvas(targetWidth, targetHeight); | |
targetCanvas.getContext('2d').fillStyle = 'blue'; | |
targetCanvas.getContext('2d').fillRect(0, 0, targetWidth, targetHeight); | |
for (let x = 0; x < targetWidth; x = x + deltaX) { | |
targetCanvas.getContext('2d').drawImage( | |
sourceCanvas, | |
0, | |
0, | |
sourceWidth, | |
sourceHeight, | |
x, | |
0, | |
deltaX, | |
targetHeight | |
); | |
} | |
fs.writeFileSync( | |
path.join(__dirname, 'target.png'), | |
new Buffer( | |
targetCanvas.toDataURL('image/png').replace(/^data.*?;base64,/, ''), | |
'base64' | |
) | |
); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment