canvas-recorder - Tool to record animations made in canvas or webgl

  •        269

Note: The package is written in Typescript and ships with types. Use in JS or TS alike. Used to set settings for the recording. In most cases calling options will be done before any frames are recorded as a first step of the program. Calling options while in between start() and stop() (while it is recording) calls is not permitted.

https://github.com/MathiasPaumgarten/canvas-recorder

Dependencies:

commander : ^2.15.1
file-saver : ^1.3.8
jszip : ^3.1.5
lodash : ^4.17.10

Tags
Implementation
License
Platform

   




Related Projects

react-ape - 🦍• [Work in Progress] React Renderer to build UI interfaces using canvas/WebGL

  •    Javascript

React Renderer to build UI interfaces using canvas/WebGL. React Ape is a react renderer to build UI interfaces using canvas/WebGL. React Ape was built to be an optional React-TV renderer. It's mainly a renderer focused on creating things for TV, PS4, Nintendo Switch, PS Vita, PS3 and low memory devices. If you're curious about the name: It's a "joke" with Netflix's React Gibbon renderer. I choose to use Ape then.

ccapture.js - A library to capture canvas-based animations at a fixed framerate

  •    Javascript

CCapture.js is a library to help capturing animations created with HTML5 canvas at a fixed framerate. An example is probably worth a lot of words: CCapture.js with Game of Life 3D.

skeletal-animation-system - A standalone, stateless, dual quaternion based skeletal animation system built with interactive applications in mind

  •    Javascript

skeletal-animation-system aims to give the user a flexible module for managing skeletal animations across different 3d models and bone groups. skeletal-animation-system aims to provide a sane API for starting, stopping and interpolating skeletal animations.

phaser - Phaser is a fun, free and fast 2D game framework for making HTML5 games for desktop and mobile web browsers, supporting Canvas and WebGL rendering

  •    Javascript

Phaser is a fast, free, and fun open source HTML5 game framework that offers WebGL and Canvas rendering across desktop and mobile web browsers. Games can be compiled to iOS, Android and native apps by using 3rd party tools. You can use JavaScript or TypeScript for development. Phaser is available in two versions: Phaser 3 and Phaser CE - The Community Edition. Phaser CE is a community-lead continuation of the Phaser 2 codebase and is hosted on a separate repo. Phaser 3 is the next generation of Phaser.

phaser-ce - Phaser CE is a fun, free and fast 2D game framework for making HTML5 games for desktop and mobile web browsers, supporting Canvas and WebGL rendering

  •    Javascript

Phaser is a fast, free, and fun open source HTML5 game framework. It uses a custom build of Pixi.js for WebGL and Canvas rendering, and supports desktop and mobile web browsers. Games can be compiled to iOS, Android and native desktop apps via 3rd party tools. You can use JavaScript or TypeScript for development. Years after release, Phaser is still one of the most starred game frameworks on GitHub. Thousands of developers worldwide use Phaser. From indies and multi-national digital agencies, to schools and Universities. Each creating their own incredible games.


origami.js - Powerful and Lightweight Library to create using HTML5 Canvas

  •    Javascript

Initially, it's a tool for teaching geometry, web, and javascript in schools. Currently, it's a powerful library to create using HTML5 Canvas. Want to contribute? Follow these recommendations.

EaselJS - The Easel Javascript library provides a full, hierarchical display list, a core interaction model, and helper classes to make working with the HTML5 Canvas element much easier

  •    Javascript

EaselJS is a library for building high-performance interactive 2D content in HTML5. It provides a feature-rich display list to allow you to manipulate and animate graphics. It also provides a robust interactive model for mouse and touch interactions.It is excellent for building games, generative art, ads, data visualization, and other highly graphical experiences. It works well alone, or with the rest of the CreateJS suite: SoundJS, PreloadJS, and TweenJS.

d3-interpolate-path - Interpolates path `d` attribute smoothly when A and B have different number of points

  •    Javascript

d3-interpolate-path is a zero-dependency that adds an interpolator optimized for SVG <path> elements. It can also work directly with object representations of path commands that can be later interpreted for use with canvas or WebGL. Note this package no longer has a dependency on d3 or d3-interpolate, but in web usage adds itself to the d3 namespace like other d3 plugins do.

Fanvas - Fanvas,一键把swf转为html5 canvas动画。 Fanvas is a tool which can turn flash into canvas animation with just one key!

  •    ActionScript

Fanvas,一键把swf转为html5 canvas动画。 Fanvas is a tool which can turn flash into canvas animation with just one key!

InteractiveCanvas - Library for distribution canvas animation over set of devices

  •    Java

The library distributes canvas animation over set of devices. The library is based on pretty dumb method: Picture class has writeToStream and createFromStream methods which serializes and deserializes Picture object respectively. After serialization byte array sends to a client device as UDP packet. On a client device the packet is deserialized back into Picture object and finaly rendered on a Canvas. That's all.

glslCanvas - Simple tool to load GLSL shaders on HTML Canvas using WebGL

  •    Javascript

GlslCanvas is JavaScript Library that helps you easily load GLSL Fragment and Vertex Shaders into an HTML canvas. I have used this in my Book of Shaders and glslEditor. That's all! glslCanvas will automatically load a WebGL context in that <canvas> element, compile the shader and animate it for you.

G3D - A pure 3D render engine compatible with webgl, running both in browser and gcanvas.

  •    Javascript

G3D is a javascript 3D engine based on WebGL. Compared with other WebGL 3D engines, G3D is a pure render engine, which means it depends on no DOM APIs but just a canvas(or canvas-like) object. This feature makes it possible that G3D works not only in browser but also in some hybrid environments like GCanvas (Weex or ReactNative). See website for more information.

RecordRTC.js - WebRTC JavaScript Library for Audio+Video+Screen+Canvas (2D+3D animation) Recording

  •    Javasript

RecordRTC is WebRTC JavaScript library for audio/video as well as screen activity recording. It supports Chrome, Firefox, Opera, Android, and Microsoft Edge. Platforms: Linux, Mac and Windows.

wind-js - An demo animation of wind on a Canvas layer in the JSAPI

  •    Javascript

This project is an experiment in client-side data processing and visualization. Most of the code in this project is taken from https://github.com/cambecc/earth and has been re-purposed to support easier application to a variety of mapping APIs and Frameworks. The code for this project uses nothing but an HTML5 Canvas element and pure Javascript. The data come from the Global Forecast System which produces a large variety of datasets as continuous global gridded datasets (more info below). The data is passed into a JS class called Windy which takes the bounds of the map, the data, and the canvas element and then applies a Bilinear Interpolation to generate a smooth surface. Once the surface has been generated a function randomly places "particles" onto the canvas at random x/y points. Each particle is then "evolved", moving in a direction and at a velocity dictated by the interpolated surface.

ImageMagick

  •    C++

ImageMagick is a software suite to create, edit, and compose bitmap images. It can read, convert and write images in a variety of formats (over 100) including DPX, EXR, GIF, JPEG, JPEG-2000, PDF, PhotoCD, PNG, Postscript, SVG, and TIFF. Use ImageMagick to translate, flip, mirror, rotate, scale, shear and transform images, adjust image colors, apply various special effects, or draw text, lines, polygons, ellipses and Bézier curves.

jcanvas - A jQuery plugin that makes the HTML5 canvas easy to work with.

  •    Javascript

jCanvas brings jQuery's powerful syntax and capability to the HTML5 canvas. Quickly create canvas-based apps that can utilize layers, animations, events, and much more. jCanvas works on all modern browsers and platforms, including iOS and Android.

PixelCraft - A Pixel Art Editor

  •    Javascript

A pixel Art & Animation Creation Tool Built using HTML5 Canvas. It is a Progressive Web App (PWA) with offline compatibility. It is mobile-friendly and is very easy to use. You can choose Any Dimensions for your Canvas, 16 X 16 is the default dimension. Dimensions below 128 X 128 are preferable for smooth operation and GIF creation.

lycheeJS - Cross-Platform JavaScript Game library (HTML5 Canvas, V8GL, WebGL, native OpenGL, NodeJS)

  •    Javascript

Cross-Platform JavaScript Game library (HTML5 Canvas, V8GL, WebGL, native OpenGL, NodeJS)

phaser-examples - Contains hundreds of source code examples and related media for the Phaser HTML5 Game Framework

  •    Javascript

Looking for Phaser 3 Examples? They are in their own repo. Phaser v2 is a fast, free and fun open source HTML5 game framework. It uses Pixi.js for WebGL and Canvas rendering across desktop and mobile web browsers. Games can be compiled to iOS and Android apps via 3rd party tools.






We have large collection of open source products. Follow the tags from Tag Cloud >>


Open source products are scattered around the web. Please provide information about the open source projects you own / you use. Add Projects.