Map of the Known Human Metabolic Pathways (2017)

4 months ago 19

Love the map but I cant download it, and the one shared here have some mistakes on the stiching. Do someone know how to download it on full resolution? Here is javascrip tryout: // Example list of tile image URLs

var tileImages = [

'tile_0_0.jpg', 'tile_0_1.jpg', 'tile_0_2.jpg', // Row 1 of tiles

'tile_1_0.jpg', 'tile_1_1.jpg', 'tile_1_2.jpg', // Row 2 of tiles

'tile_2_0.jpg', 'tile_2_1.jpg', 'tile_2_2.jpg', // Row 3 of tiles

];

var tilesPerRow = 3; // Number of tiles in each row

var tileWidth = 256; // Width of each tile in pixels

var tileHeight = 256; // Height of each tile in pixels

// Create a canvas to stitch the images

var canvas = document.createElement('canvas');

var ctx = canvas.getContext('2d');

// Calculate the total size of the final image

canvas.width = tilesPerRow * tileWidth;

canvas.height = (tileImages.length / tilesPerRow) * tileHeight;

// Function to load an image

function loadImage(url) {

return new Promise((resolve, reject) => {

var img = new Image();

img.crossOrigin = "Anonymous"; // Attempt to deal with CORS

img.onload = () => resolve(img);

img.onerror = reject;

img.src = url;

});

}

// Load all images and draw them on the canvas

Promise.all(tileImages.map(loadImage)).then(images => {

images.forEach((img, index) => {

var x = (index % tilesPerRow) * tileWidth;

var y = Math.floor(index / tilesPerRow) * tileHeight;

ctx.drawImage(img, x, y, tileWidth, tileHeight);

});

// Trigger download of the canvas as an image

var link = document.createElement('a');

link.download = 'map.jpg';

link.href = canvas.toDataURL('image/jpeg');

link.click();

}).catch(error => {

console.error("Failed to load one or more images", error);

});

Read Entire Article