This page is read only. You can view the source, but not change it. Ask your administrator if you think this is wrong. ====== Generating Photos with Code 程式生成照片 ====== By [[yiler-huang| Yiler Huang]] ===== First round ===== {{:yiler-jimp-photo-1.jpeg?400|}} {{:yiler-jimp-photo-2.jpeg?400|}} {{:yiler-jimp-photo-3.jpeg?400|}} {{:yiler-jimp-photo-4.jpeg?400|}} {{:yiler-jimp-photo-5.jpeg?400|}} {{:yiler-jimp-photo-6.jpeg?400|}} {{:yiler-jimp-photo-7.jpeg?400|}} {{:yiler-jimp-photo-8.jpeg?400|}} {{:yiler-jimp-photo-9.jpeg?400|}} {{:yiler-jimp-photo-10.jpeg?400|}} {{:yiler-jimp-photo-11.jpeg?400|}} {{:yiler-jimp-photo-12.jpeg?400|}} ===== Second round ===== {{:yiler-jimp-second-round-1.jpg?400|}} {{:yiler-jimp-second-round-2.jpg?400|}} {{:yiler-jimp-second-round-3.jpg?400|}} {{:yiler-jimp-second-round-4.jpg?400|}} {{:yiler-jimp-second-round-5.jpg?400|}} ===== Third round ===== ==== First program ==== {{:yiler-jimp-round-3-1.jpg?400|}} {{:yiler-jimp-round-3-2.jpg?400|}} {{:yiler-jimp-round-3-3.jpg?400|}} {{:yiler-jimp-round-3-4.jpg?400|}} {{:yiler-jimp-round-3-5.jpg?400|}} {{:yiler-jimp-round-3-6.jpg?400|}} {{:yiler-jimp-round-3-7.jpg?400|}} {{:yiler-jimp-round-3-8.jpg?400|}} {{:yiler-jimp-round-3-9.jpg?400|}} {{:yiler-jimp-round-3-10.jpg?400|}} ==== Second program ==== {{:yiler-jimp-round-3-11.jpg?400|}} {{:yiler-jimp-round-3-12.jpg?400|}} {{:yiler-jimp-round-3-13.jpg?400|}} {{:yiler-jimp-round-3-14.jpg?400|}} {{:yiler-jimp-round-3-15.jpg?400|}} {{:yiler-jimp-round-3-16.jpg?400|}} {{:yiler-jimp-round-3-17.jpg?400|}} {{:yiler-jimp-round-3-18.jpg?400|}} {{:yiler-jimp-round-3-19.jpg?400|}} <code javascript> // import the JIMP library const Jimp = require("jimp"); const fs = require('fs'); // knuth shuffle from https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array //shuffle function shuffle(array) { var currentIndex = array.length, randomIndex; // While there remain elements to shuffle... while (currentIndex != 0) { // Pick a remaining element... randomIndex = Math.floor(Math.random() * currentIndex); currentIndex--; // And swap it with the current element. [array[currentIndex], array[randomIndex]] = [ array[randomIndex], array[currentIndex] ]; } return array; } //randomRange function randomRange(min, max) { return min + ((max - min) * Math.random()) } //pickFromArray function pickFromArray(array) { return array[Math.floor(Math.random() * array.length)]; } //from https://jeremyresearch.medium.com/node-js-count-the-numbers-of-files-in-a-directory-9562dec64a45 // set the path data in an array let pathArray = [ "pics/input1.jpg", "pics/input2.jpg", "pics/input3.jpg", "pics/input4.jpg", "pics/input5.jpg", "pics/input6.jpg", "pics/input7.jpg", "pics/input8.jpg", ]; function trueOrFalse() { let output = Math.random() < 0.5 ? true : false; return output } // use map to read the path data and produce JIMP Promises let newPA = shuffle(pathArray).slice(0, 3) let jimpData = newPA.map(path => Jimp.read(path)); // through Promise.all, get the data from the Promises and process it through the methods provided by JIMP // the data processing will proceed in parallel, just as it does in Hydra for (let i = 0; i < 50; i++) { Promise.all(jimpData).then((pictures) => { return pictures[0] .grayscale() //composite argument1: shiftX, argument2: shiftY .composite(pictures[1].color([{ apply: "tint", params: [randomRange(0, 30)] }]).mirror(trueOrFalse(), trueOrFalse()), 0, 0, { mode: Jimp.BLEND_LIGHTEN, opacitySource: 1 }) .composite(pictures[2].grayscale().dither565().dither565(), 0,0, { mode:Jimp.BLEND_DARKEN, opacitySource: 0.6 }) .color([{ apply: "hue", params: [randomRange(-360, 360)] }]) .resize(2000, 2000) .write(`./output-3/output-${i}.jpg`); }).catch((err) => { console.error(err) }) newPA = shuffle(pathArray).slice(0, 2) jimpData = newPA.map(path => Jimp.read(path)); } </code> ==== Program 3 ==== {{:yiler-jimp-round-3-20.jpg?400|}} {{:yiler-jimp-round-3-21.jpg?400|}} {{:yiler-jimp-round-3-22.jpg?400|}} {{:yiler-jimp-round-3-23.jpg?400|}} {{:yiler-jimp-round-3-24.jpg?400|}} {{:yiler-jimp-round-3-25.jpg?400|}} {{:yiler-jimp-round-3-26.jpg?400|}} {{:yiler-jimp-round-3-27.jpg?400|}} {{:yiler-jimp-round-3-28.jpg?400|}} {{:yiler-jimp-round-3-29.jpg?400|}} {{:yiler-revised-photo-porfolio-3.jpg?400|}} {{:yiler-revised-photo-porfolio-2.jpg?400|}} {{:yiler-revised-photo-porfolio-1.jpg?400|}} <code> // import the JIMP library const Jimp = require("jimp"); const fs = require('fs'); // knuth shuffle from https://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array //shuffle function shuffle(array) { var currentIndex = array.length, randomIndex; // While there remain elements to shuffle... while (currentIndex != 0) { // Pick a remaining element... randomIndex = Math.floor(Math.random() * currentIndex); currentIndex--; // And swap it with the current element. [array[currentIndex], array[randomIndex]] = [ array[randomIndex], array[currentIndex] ]; } return array; } //randomRange function randomRange(min, max) { return min + ((max - min) * Math.random()) } //pickFromArray function pickFromArray(array) { return array[Math.floor(Math.random() * array.length)]; } //from https://jeremyresearch.medium.com/node-js-count-the-numbers-of-files-in-a-directory-9562dec64a45 // set the path data in an array let pathArray = [ "pics/input1.jpg", "pics/input2.jpg", "pics/input3.jpg", "pics/input4.jpg", "pics/input5.jpg", "pics/input6.jpg", "pics/input7.jpg", "pics/input8.jpg", "pics/input9.jpg", "pics/input10.jpg", "pics/input11.jpg", "pics/input12.jpg", ]; function trueOrFalse() { let output = Math.random() < 0.5 ? true : false; return output } // use map to read the path data and produce JIMP Promises let newPA = shuffle(pathArray).slice(0, 3) let jimpData = newPA.map(path => Jimp.read(path)); // through Promise.all, get the data from the Promises and process it through the methods provided by JIMP // the data processing will proceed in parallel, just as it does in Hydra for (let i = 0; i < 100; i++) { Promise.all(jimpData).then((pictures) => { return pictures[0] .grayscale() //composite argument1: shiftX, argument2: shiftY .composite(pictures[1].grayscale().invert(), 0,0, { mode:Jimp.BLEND_DARKEN, opacitySource: 0.8 }) .composite(pictures[2].color([{ apply: "tint", params: [randomRange(0, 30)] }]).mirror(trueOrFalse(), trueOrFalse()), 0, 0, { mode: Jimp.BLEND_LIGHTEN, opacitySource: 1 }) .color([{ apply: "hue", params: [randomRange(-360, 360)] }]) .resize(2000, 2000) .write(`./output-5/output-${i}.jpg`); }).catch((err) => { console.error(err) }) newPA = shuffle(pathArray).slice(0, 3) jimpData = newPA.map(path => Jimp.read(path)); } </code> yiler-huang-generating-photos-with-code.txt Last modified: 2023/06/05 23:33by yiler.huang Log In