diff --git a/README.md b/README.md index 4406bb8..7173b99 100644 --- a/README.md +++ b/README.md @@ -2,13 +2,12 @@ The script in /images will generate textures and spritesheet assets which are needed for the [vikus-viewer](https://github.com/cpietsch/vikus-viewer) (repo). The script in /tsne will generate a TSNE layout which can be used as an alternative to the timeline-view in VIKUS Viewer. - ## Requirements + - nodejs - use the installer on https://nodejs.org/en/download/ - or use nvm https://github.com/creationix/nvm - ## Usage image script Install the script as a command line tool without the need of cloning / downloading: @@ -17,15 +16,15 @@ Install the script as a command line tool without the need of cloning / download npm install -g vikus-viewer-script ``` -Alternatively you can download or clone this repo and install the required node packages: +Alternatively you can download or clone this repo and install the required node packages: ```sh git clone https://github.com/cpietsch/vikus-viewer-script cd vikus-viewer-script npm install ``` -Note: You can run the script via `node bin/textures` instead of `vikus-viewer-script` if you have cloned it. +Note: You can run the script via `node bin/textures` instead of `vikus-viewer-script` if you have cloned it. All your images should be in one folder (lets say "images") and named x.jpg where x is the id of the image corresponding to the id field in data.csv @@ -43,11 +42,12 @@ You are now finished in preparing the textures and spritesheets! Copy the folder 1024, 4096 and sprites inside data into your /data folder of your [vikus-viewer](https://github.com/cpietsch/vikus-viewer) instance. After a successful run you can delete the tmp folder. -*A note for collections of 5000+ items*: In the default configuration the script will generate sprites at the maximum dimensions of 256x256px. For faster loading time and collections with a lot of items, you should adjust the resolution of the sprites by running changing the ``--spriteSize`` flag to e.g. 90. +_A note for collections of 5000+ items_: In the default configuration the script will generate sprites at the maximum dimensions of 256x256px. For faster loading time and collections with a lot of items, you should adjust the resolution of the sprites by running changing the `--spriteSize` flag to e.g. 90. ### Examples: #### Create textures + ```sh vikus-viewer-script "/path/to/your/images/*.jpg" # on jpg's vikus-viewer-script "/path/to/your/images/*.+(jpg|jpeg|png)" # on multiple formats @@ -55,6 +55,7 @@ vikus-viewer-script "/path/to/your/images/**/*.jpg" # on all jpg's in subfolders ``` ### CLI commands + ```sh Usage: vikus-viewer-script "/path/to/large/images/*.jpg" [options] @@ -73,17 +74,19 @@ Options: --spriteFormat spritesheets format (jpg or png) [default: "jpg"] --largeSize resolution of full sized images [default: 4096] --mediumSize resolution of images loaded on the fly [default: 1024] + --skipTextures skip texture generation, only make spritesheets + [default: false] -h, --help Show help [boolean] Examples: vikus-viewer-script "/path/to/large/images/*.jpg" create VV textures from jpgs -``` +``` ## Usage t-SNE/UMAP script As an alternative to the temporal view, you can create a t-SNE layout based on image similarity. The script creates a tsne.csv which can be put next to the data.csv in the /data folder. Image similarity is calculated via the [mobilenet activation logit](https://beta.observablehq.com/@cpietsch/imagenet-activation-logit) and then run throught t-SNE or UMAP. An additional spacing step ensures no overlaying images in the distribution. -Download or clone this repo, navigate to /similarity and install the required node packages: +Download or clone this repo, navigate to /similarity and install the required node packages: ```sh cd /similarity @@ -93,6 +96,7 @@ npm i Add the `-t` flag to the script to use the much faster tfjs-node implementation instead of the default tfjs. Run the t-SNE script: + ```sh node tsne.js -i /path/to/images ``` diff --git a/bin/textures b/bin/textures old mode 100644 new mode 100755 index ea14d3e..d07cbbc --- a/bin/textures +++ b/bin/textures @@ -29,13 +29,12 @@ const argv = require("yargs") .default("spriteQuality", 70) .describe("spriteFormat", "spritesheets format (jpg or png)") .default("spriteFormat", "jpg") - .describe("largeSize", "resolution of full sized images, (0 to disable)") + .describe("largeSize", "resolution of full sized images") .default("largeSize", 4096) - .describe( - "mediumSize", - "resolution of images loaded on the fly, (0 to disable)" - ) + .describe("mediumSize", "resolution of images loaded on the fly") .default("mediumSize", 1024) + .describe("skipTextures", "skip texture generation, only make spritesheets") + .default("skipTextures", false) .help("h") .alias("h", "help").argv; diff --git a/package.json b/package.json index 48b6b41..0139e3d 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vikus-viewer-script", - "version": "2.0.5", + "version": "2.0.6", "description": "Preprocessing scripts for vikus-viewer", "author": { "name": "Christopher Pietsch", diff --git a/src/textures.js b/src/textures.js index 353e24d..2cd4973 100644 --- a/src/textures.js +++ b/src/textures.js @@ -4,6 +4,7 @@ const cascade = require("./cascade.js"); const sharpsheet = require("sharpsheet"); exports.run = async function textures(inputPath, options) { + const skipTextures = options.skipTextures || false; const textureRes1 = options.largeSize || 4096; const textureRes2 = options.mediumSize || 1024; const textureRes3 = options.spriteSize || 128; @@ -19,20 +20,20 @@ exports.run = async function textures(inputPath, options) { const spritesPath = createPath(workPath + "/sprites"); const tmpPath = createPath(workPath + "/tmp"); const textureRes1Path = - textureRes1 && createPath(workPath + "/" + textureRes1); + !skipTextures && createPath(workPath + "/" + textureRes1); const textureRes2Path = - textureRes2 && createPath(workPath + "/" + textureRes2); + !skipTextures && createPath(workPath + "/" + textureRes2); const textureRes3Path = createPath(tmpPath + "/" + textureRes3); const resizeSteps = [ - textureRes1 && { + !skipTextures && { width: textureRes1, height: textureRes1, format: textureFormat, quality: textureQuality, path: textureRes1Path, }, - textureRes2 && { + !skipTextures && { width: textureRes2, height: textureRes2, format: textureFormat, @@ -46,7 +47,7 @@ exports.run = async function textures(inputPath, options) { quality: 100, path: textureRes3Path, }, - ]; + ].filter((s) => s); console.log("\nlooking for images at ", inputPath);