Spritejs is a cross platform high-performance graphics system, which can render graphics on web, node, desktop applications and mini-programs.
SpritejsNext is the new version of spritejs. It is renderer agnostic enabling the same api to render in multiple contexts: webgl2, webgl, and canvas2d.
Manipulate the sprites in canvas as you do with the DOM elements.
SpriteJS - spritejs.com
<script src="https://unpkg.com/spritejs@3/dist/spritejs.min.js"></script> <div id="container" style="width:400px;height:400px"></div> <script> const imgUrl = 'https://s5.ssl.qhres2.com/static/ec9f373a383d7664.svg' const {Scene, Sprite} = spritejs; const container = document.getElementById('container'); const paper = new Scene({ container, width: 400, height: 400, }) const sprite = new Sprite(imgUrl) sprite.attr({ bgcolor: '#fff', pos: [0, 0], size: [400, 400], borderRadius: '200' }) paper.layer().appendChild(sprite) </script>
In browser:
<script src="https://unpkg.com/spritejs@3/dist/spritejs.min.js"></script>
With Node.js:
npm install spritejs --save
import * as spritejs from 'spritejs';
SpriteJSNext can render 3D elements through 3D extension library.
<script src="https://unpkg.com/spritejs@3/dist/spritejs.es.min.js"></script> <script src="https://unpkg.com/sprite-extend-3d/dist/sprite-extend-3d.js"></script>
Or from NPM
import {Scene} from 'spritejs'; import {Cube, shaders} from 'sprite-extend-3d';
Compatible with d3.js.
A visulization library based on spritejs.
SpritejsNext provides several kinds of basic sprite elements, which can be operated on the layer like DOM elements.
Build with NPM
Build Doc
Compatible for most modern browsers.
You should import babel-polyfill for early browers(i.e. iOS 8).
Thanks goes to these wonderful people (emoji key):
Credits and Acknowledgementssvg-path-contours Approximates an SVG path into a discrete list of 2D contours (polylines).
extrude-polyline Extrudes a 2D polyline with a given line thickness and the desired join/cap types.
triangulate-contours Triangulates a series of contours using Tess2.js.
OGL OGL is a small, effective WebGL library aimed at developers who like minimal layers of abstraction, and are comfortable creating their own shaders.
RetroSearch is an open source project built by @garambo | Open a GitHub Issue
Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo
HTML:
3.2
| Encoding:
UTF-8
| Version:
0.7.4