0

I've been on this issue for a few days, what I need to do is create a large image to map onto a sphere, requirements are:

  • create a large image with height twice the width, both must be a power of 2 ex: 2048x1024
  • be created from a folder containing 10.000 images, they might have different resolutions, so a resizing might be needed

What I've tried so far:

Tile four images together using Node.js and GraphicsMagick http://www.imagemagick.org/script/montage.php

I am open to using anything server-side, from nodejs to python or even php, anything that can do the job.

Could anyone at least point me in the right direction?

Thank you!!

ThomasDEV
  • 75
  • 7
  • So, what exactly isn't working for you? Were you able to create your tiled image? Do you have to use multiple images? Seems like choosing one image that's close to the resolution you need and then crop or scale as needed to fit dimensions might create better results. – kevintechie Jan 13 '22 at 19:59
  • I need to create a grid of images for 10k total roughly, so lets say 100x100 images, I do not know what the fastest way to create this would be, and what language to use? – ThomasDEV Jan 13 '22 at 20:39

1 Answers1

0

Resolved using merge-images-v2

const mergeImages = require('merge-images-v2');
const Canvas = require('node-canvas');
const { Image } = require('node-canvas');

var images = [];
let totalWidthPixels, totalHeightPixels;
let imageDir = './images/'


Array.prototype.random = function () {
    return this[Math.floor((Math.random()*this.length))];
  }

function createImagesObject(gridHorizontalWidth,gridVerticalHeight,imageRes) {
    totalWidthPixels = gridHorizontalWidth * imageRes;
    totalHeightPixels = gridVerticalHeight * imageRes;
    let totalPlots = gridHorizontalWidth * gridVerticalHeight;

    for (let i = 0; i <= totalPlots; i++) {
        let currentX = 0;
        let currentY = 0;

        let currentColumn =  parseInt(i/gridVerticalHeight);
        let currentColumnRemainder =  i % gridVerticalHeight;

        //console.log(currentColumn+ "   ------     " + currentColumnRemainder);

        currentX = currentColumn * imageRes;
        currentY = currentColumnRemainder * imageRes;

        images.push({ src: [imageDir+'default_gray.png',
                            imageDir+'bought_gray.png',
                            imageDir+'userImage.png'].random(),
                       x: currentX, 
                       y: currentY })
    }

}
createImagesObject(128,64,64);

mergeImages(images, {
  Canvas: Canvas,
  width: totalWidthPixels,
  height: totalHeightPixels
})
  .then(b64 => {
    var base64Data = b64.replace(/^data:image\/png;base64,/, "");

    require("fs").writeFile("out.png", base64Data, 'base64', function(err) {
    console.log(err);
    });
      
  });
ThomasDEV
  • 75
  • 7