node-drawille - Drawing in terminal with unicode braille characters

•    Javascript

---

drawing in terminal with unicode braille characters. The idea is based on drawille by @asciimoo.See examples.

vim-minimap - A Sublime-like minimap for VIM, based on the Drawille console-based drawing library

•    Python

---

The Sublime text-editor can display an useful overview of the code as a minimap sidebar. We can implement the same thing in Vim, relying on the Drawille library to 'draw' in text mode.

fabric.js - Javascript Canvas Library, SVG-to-Canvas (& canvas-to-SVG) Parser

•    Javascript

---

Object model for HTML5 canvas, and SVG-to-canvas parser. Backed by jsdom and node-canvas.

canvas graphic graphics svg node-canvas parser html5 object-model visualization data-visualization charts charting-library

node-canvas - Node canvas is a Cairo backed Canvas implementation for NodeJS.

•    C++

---

Alpha versions of 2.0 can be installed using npm install canvas@next.node-canvas is a Cairo backed Canvas implementation for NodeJS.

canvas graphic graphics pixman cairo image images pdf

node-canvas - Node canvas is a Cairo backed Canvas implementation for NodeJS.

•    C++

---

Node canvas is a Cairo backed Canvas implementation for NodeJS.

palette - Node.js image color palette extraction with node-canvas

•    Javascript

---

Note: Palette's dependency, node-canvas, requires that Cairo be installed. Please see the installation guide for node-canvas for further details.Palette's public API consists of a single function, the one returned by require(). This function accepts the canvas you wish to compute a color palette for, and an optional number of samples defaulting to 5.

palette color image sample canvas photo

context-blender - Photoshop-style blend modes for HTML Canvas Contexts

•    Javascript

---

Adobe® Photoshop® has a variety of helpful blend modes for compositing images from multiple RGBA layers. This small library provides the same functionality for HTML Canvas Contexts, with the goal of producing the same results as Photoshop. This will also install node-canvas, which requires a working Cairo install. See https://github.com/Automattic/node-canvas#installation for more details.

html5 canvas photoshop layer context src-over screen multiply difference src-in overlay hardlight colordodge dodge colorburn burn darken darker lighten lighter exclusion softlight luminosity color hue saturation lightercolor darkercolor

ansi-canvas - Render a <canvas> node to your terminal

•    Javascript

---

This module provides a <canvas> object backed by node-canvas, with its width and height properties automatically set to the proper size of the terminal window.

ansi canavs terminal

spritejs - A cross-platform lightweight 2D render object model.

•    Javascript

---

SpriteJS is a cross-platform lightweight 2D render object model. Manipulate the sprites in canvas as you do with the DOM elements.

spritejs canvas animation graphics rendering renderer rendering-2d-graphics canvas-game canvas-animation svg-path vue react svg sprite graphic path d3 node-canvas parser html5 object-model

kittydar - [UNMAINTAINED] Face detection for cats in JavaScript - demo for TXJS 2012 talk

•    Javascript

---

Kittydar takes a canvas element. In node you can get a Canvas object with node-canvas. Kittydar will give an approximate rectangle around the cat's head. Each rectangle has an x and y for the top left corner, and a width and height of the rectangle.

konva - Konva

•    Javascript

---

Konva is an HTML5 Canvas JavaScript framework that enables high performance animations, transitions, node nesting, layering, filtering, caching, event handling for desktop and mobile applications, and much more. You can draw things onto the stage, add event listeners to them, move them, scale them, and rotate them independently from other shapes to support high performance animations, even if your application uses thousands of shapes. Served hot with a side of awesomeness.

konva shape node-canvas canvas animation drag-and-drop graphics animations graphic html5

domvas - Domvas implements the missing piece that connects the DOM and Canvas.

•    Javascript

---

Domvas implements the missing piece that connects the DOM and Canvas. It gives to the ability to take arbitrary DOM content and paint it to a Canvas of your choice. readyCallback's 'this' and first argument points to a valid, preloaded image node that you can simply draw to your canvas context.

Chart.js - Simple HTML5 Charts using the <canvas> tag

•    Javascript

---

Simple HTML5 charts using the canvas element. It's easy to get started with Chart.js. All that's required is the script included in your page along with a single <canvas> node to render the chart. It redraws charts on window resize for perfect scale granularity.

chart html5 canvas graph html5-charts visualization data-visualization charts charting-library responsive-charts

drawille - Pixel graphics in terminal with unicode braille characters

•    Python

---

Pixel graphics in terminal with unicode braille characters

creep - a pretty sweet 4px wide pixel font.

•    VimL

---

I never found the pixel font that was perfect for me, so I decided to roll my own with creep. It is a pretty compact (only 4px wide!) font that's great for smaller screens (like my 11" laptop). I'm constantly adding in new characters (diacritics, box-drawing characters, etc.), so I figured I'd put it up on github for poeple to reap benefits of this.

font pixel-font haskell-syntax box-drawing fontforge sparkline drawille

blessed-contrib - Build terminal dashboards using ascii/ansi art and javascript

•    Javascript

---

Build dashboards (or any other application) using ascii/ansi art and javascript. Friendly to terminals, ssh and developers. Extends blessed with custom drawille and other widgets.

qrious - Pure JavaScript library for QR code generation using canvas

•    Javascript

---

QRious is a pure JavaScript library for generating QR codes using HTML5 canvas. Check out node-qrious if you want to install it for use within Node.js.

qr qrcode qrcode-generator browser code encode canvas image

glitch-canvas - glitch your canvas element

•    Javascript

---

for a live example, you can check out my jpg-glitch editor online. this library can be used in web browsers as well as in node. it supports loading as an AMD module, as a CommonJS module or a global variable..

glitch effect fx canvas

gifencoder - Server side animated gif generation for node.js

•    Javascript

---

NB: The chunks that get emitted by your read stream must either by a 1-dimensional bitmap of RGBA data (either an array or Buffer), or a canvas 2D context. Individuals making significant and valuable contributions are given commit-access to the project to contribute as they see fit. This project is more like an open wiki than a standard guarded open source project.

gif encode encoder encoding animated canvas node-canvas server image images animations

jQuery layout background canvas plugin: gradients, rounded corners without CSS

•    JQuery

---

jQuery layout and background canvas plugins allow web designers to draw with the canvas API in the background of a div or whatever block style element. The full canvas API power gives the flexibility to draw gradients, rounded corners without CSS trickery.

background-canvas canvas canvas-api css jquery-layout jquery-plugin