procedurally generated fish drawings

Lingdong Huang

Last update: Jan 3, 2023

Overview

fishdraw

procedurally generated fish drawings. demo

generates all sorts of weird fishes
outputs polylines (supported format svg, json, csv, etc.)
full procedural generation, single file no dependencies
plotter-centric
export drawing animation:

usage

basic

node fishdraw.js > output.svg

specify seed (from a string) and output format:

node fishdraw.js --seed "Biggus fishus" --format smil > output.svg

the seed string is used as the name of the fish (printed in the drawing). If unspecified, a random pseudo-Latin name will be auto generated.
format options: svg (regular svg), smil (animated svg), csv (each polyline on a comma-separated line) and json.

use as JS library:

const {fish,generate_params} = require('./fishdraw.js');
let polylines = fish(generate_params());
console.log(polylines);

gallery

Automates PWA asset generation and image declaration. Automatically generates icon and splash screen images, favicons and mstile images. Updates manifest.json and index.html files with the generated images according to Web App Manifest specs and Apple Human Interface guidelines.

pwa-asset-generator ✨ Automates PWA asset generation and image declaration. Automatically generates icon and splash screen images, favicons and mstile

Jan 6, 2023

📱 Free to use static generated website template for your mobile app

Mobile App Landing Page Template 📱 Free to use static generated landing page template for your mobile app 💡 Features Mobile App Landing Page Templat

Dec 30, 2022

🥰 Mini world simulator is a terminal application made in JavaScript to control the world that is being generated.

Mini-world "Simulator" Mini world simulator is a terminal application made in JavaScript to control the world that is being generated. It has no other

Mar 14, 2022

Automatically generated documentation for the Valorant API endpoints the client uses internally.

Valorant API Docs To read documentation and get started, see Docs This is a project designed to automatically document Valorant endpoints based on a J

Dec 25, 2022

Created by Hashlips! In this repository, Hashlips and ScrawnyViking teach you how to create your unique randomly generated NFTs and launch them on to a free Github Domain where people can buy your NFTs from

Thank You HashLips 👄 Upgraded and Articulated by ScrawnyViking aka TWECryptoDev All the code in these repos was created and explained by HashLips - P

Dec 14, 2022

Grid-tool - Small tool that allows you to integrate a predefined or generated grid into your front-end development environment.

Grid tool Small tool that allows you to integrate a predefined or generated grid into your front-end development environment. Tool installation includ

Jan 4, 2022

Browser Extension to deliver AI-generated alt-text for the Visually Impaired.

GenAlt - Generated Image Descriptions for BVI The Blind and Visually Impaired (BVI) rely on alt-text, image descriptions, to experience the trillions

Sep 10, 2022

Example auto-generated OpenAPI client library and an accompanying example Angular app.

To utilize this demo Head into petstore_frontend\petes_pets Run npm install Go to frontend_client_lib\out Run npm install Head back into petstore_fron

Jan 21, 2022

Add WebAssembly ESM integration to Vite and support wasm-pack generated modules

Add WebAssembly ESM integration (aka. Webpack's asyncWebAssembly) to Vite and support wasm-pack generated modules

Dec 26, 2022

Central service used for management of CodeSupport user generated content.

CodeSupport API About This repository contains the code for the CodeSupport API. The project is written in TypeScript using the NestJS framework with

Oct 14, 2022

GitHub Action that posts the report in a comment on a GitHub Pull Request from coverage data generated by nyc (istanbul)

GitHub Action: Report NYC coverage GitHub Action that posts the report in a comment on a GitHub Pull Request from coverage data generated by nyc (ista

Nov 23, 2022

Upload your webpack-generated assets to CDN, allowing renaming/rehashing.

webpack5-cdn-plugin For webpack4, please refer to webpack4-cdn-plugin. Docs Install npm i webpack5-cdn-plugin -D Usage const { Webpack5CDNPlugin } =

Aug 22, 2022

Automatically construct and visualize Graphs generated from your Node.js project

cyclops is a minimalist developer tool that can be used to generate directed graphs from your Node.js project. It can automatically detect circular de

Jan 5, 2023

Obsidian plugin: Type text shortcuts that expand into javascript generated text.

Obsidian Plugin - Text Expander JS (open beta) This Obsidian plugin allows the user to type text shortcuts that are replaced by (or "expanded into") j

Dec 27, 2022

Generated TypeScript interfaces for Aptos Move.

Aptos Framework TypeScript SDK Generated TypeScript interfaces for Aptos Move. This contains types for: AptosFramework MoveNursery MoveStdlib Releases

Aug 25, 2022

Basic https setup using an automatically generated self-signed certificate

@vitejs/plugin-basic-ssl A plugin to generate untrusted certificates which still allows to access the page after proceeding a wall with warning. In mo

Jan 2, 2023

Happy Birthday is a web-based party live background generated by CANVAS powered by JavaScript. This show a lot of random colorize particles in the background.

Happy BirthDay JS Happy Birthday is a web-based party live background generated by CANVAS powered by JavaScript. This show a lot of random colorize pa

Oct 29, 2022

Get dynamically generated your github contributor stats on your READMEs!

GitHub Readme Contributor Stats Get dynamically generated your github contributor stats on your READMEs! Features GitHub Contributor Stats Card Themes

Dec 11, 2022

Automatically construct, traverse and visualize graphs generated from your Node.js project

skott is a minimalist developer tool that can be used to efficiently generate directed graphs from your JavaScript/Node.js project. It can automatical

Dec 21, 2022

Comments

Overload the .flat function

Hello, I loved playing with fishdraw, amazing work! I made a change so that the javascript would run from my desktop. The change overloads the .flat function which exists in browsers, but not on the latest node js version. I think this change will let the code run anywhere. This is the issue that I encountered running on Linux, this is the issue I found on stackoverflow (I'm not a js developer) https://stackoverflow.com/questions/50993498/flat-is-not-a-function-whats-wrong John

opened by InkyLinesPlots 1
Is there any conceivable way to turn this into a screensaver?

I don't have the skill to do it myself, but there's something very restful about watching the drawings be completed, I feel it would be a good screensaver.

opened by johnhorner 1
How do users draw their favorite fish？

hi LingDong，

How can users draw their favorite fish, such as tuna, eel？

Maybe a custom JavaScript library can be used for drawing them, how to create and implement a custom JS library.

Thanks

opened by Otoliths 3

Owner

Lingdong Huang

GitHub https://fishdraw.glitch.me/

This JavaScript library produces complementary gradients generated from the top 2 dominant colours in supplied images.

Grade Demo Check it out Install Download this repo and grab the grade.js file from the /docs/dist folder. Or install from npm: npm install grade-js Us

3.7k Jan 2, 2023

Upload your webpack-generated assets to CDN, allowing renaming/rehashing.

webpack5-cdn-plugin For webpack4, please refer to webpack4-cdn-plugin. Docs Install npm i webpack5-cdn-plugin -D Usage const { Webpack5CDNPlugin } =

4 Aug 22, 2022

Might be mineral fish site in future, idk. Currently just a fish list. Made with Svelte

Might be mineral fish site in future, idk. Currently just a fish list. Made with Svelte. Built version (used at mineralfish.github.io) at the build branch. Build steps and original README below.

3 Nov 3, 2022

Contains html file showcasing Earthquake related data generated in the form of VR model, ArcGIS API with real-time earthquake feed and video of simulation of earthquake generated in blender

Module-EADGI-Project-All about Earthquakes Introduction Contains html file showcasing Earthquake related data generated in the form of VR model, ArcGI

2 Jun 9, 2022

👨🏼‍🎨 It is a virtual blackboard, where you can make 🖌 drawings through 🖱 the mouse. You have the option to choose 🎨 colors and line thickness.

????‍?? Lets Draw ?? ÍNDICE 1. Lets-Draw 2. Realization of the Project 3. Technologies used 4. Authors 1. Lets-Draw ????‍?? It is a virtual blackboard

2 Mar 7, 2022

Landscape Generator is An open Source web application that generates landscape drawings randomly, then gives you the ability to edit it and export it as SVG or PNG.

Landscape Generator ## About Landscape Generator is An open Source web application that generates landscape drawings randomly, then gives you the abil

9 Apr 15, 2022

procedurally generated fish drawings

Related tags

Overview

fishdraw

usage

gallery

You might also like...

Comments

Owner

Lingdong Huang

This JavaScript library produces complementary gradients generated from the top 2 dominant colours in supplied images.

Upload your webpack-generated assets to CDN, allowing renaming/rehashing.

Might be mineral fish site in future, idk. Currently just a fish list. Made with Svelte

Contains html file showcasing Earthquake related data generated in the form of VR model, ArcGIS API with real-time earthquake feed and video of simulation of earthquake generated in blender

👨🏼‍🎨 It is a virtual blackboard, where you can make 🖌 drawings through 🖱 the mouse. You have the option to choose 🎨 colors and line thickness.

Landscape Generator is An open Source web application that generates landscape drawings randomly, then gives you the ability to edit it and export it as SVG or PNG.

CVTC Capstone Project - The Fish Net

Algorithmically generated triangle art

A Web Component compiler for building fast, reusable UI components and static site generated Progressive Web Apps

This JavaScript library produces complementary gradients generated from the top 2 dominant colours in supplied images.