Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More
Socket
Sign inDemoInstall
Socket

skia-canvas

Package Overview
Dependencies
Maintainers
1
Versions
26
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

skia-canvas - npm Package Compare versions

Comparing version 0.9.26 to 0.9.27

15

package.json
{
"name": "skia-canvas",
"version": "0.9.26",
"version": "0.9.27",
"description": "A canvas environment for Node",

@@ -28,3 +28,3 @@ "author": "Christian Swinehart <drafting@samizdat.co>",

"dependencies": {
"@mapbox/node-pre-gyp": "^1.0.5",
"@mapbox/node-pre-gyp": "^1.0.6",
"glob": "^7.2.0",

@@ -36,10 +36,13 @@ "path-browserify": "^1.0.1",

"devDependencies": {
"aws-sdk": "^2.1006.0",
"aws-sdk": "^2.1013.0",
"cargo-cp-artifact": "^0.1",
"express": "^4.17.1",
"jest": "^27.2.5",
"jest": "^27.3.1",
"lodash": "^4.17.21",
"nodemon": "^2.0.13",
"nodemon": "^2.0.14",
"tmp": "^0.2.1"
},
"files":[
"lib"
],
"binary": {

@@ -49,3 +52,3 @@ "module_name": "index",

"remote_path": "./v{version}",
"package_name": "{platform}-{arch}-{node_napi_label}.tar.gz",
"package_name": "{platform}-{arch}-{node_napi_label}-{libc}.tar.gz",
"host": "https://skia-canvas.s3.us-east-1.amazonaws.com",

@@ -52,0 +55,0 @@ "napi_versions": [

116

README.md

@@ -27,41 +27,2 @@ # Skia Canvas

### Basic Usage
```js
const {Canvas, loadImage} = require('skia-canvas'),
rand = n => Math.floor(n * Math.random());
let canvas = new Canvas(600, 600),
ctx = canvas.getContext("2d"),
{width, height} = canvas;
// draw a sea of blurred dots filling the canvas
ctx.filter = 'blur(12px) hue-rotate(20deg)'
for (let i=0; i<800; i++){
ctx.fillStyle = `hsl(${rand(40)}deg, 80%, 50%)`
ctx.beginPath()
ctx.arc(rand(width), rand(height), rand(20)+5, 0, 2*Math.PI)
ctx.fill()
}
// mask all of the dots that don't overlap with the text
ctx.filter = 'none'
ctx.globalCompositeOperation = 'destination-in'
ctx.font='italic 480px Times, DejaVu Serif'
ctx.textAlign = 'center'
ctx.textBaseline = 'top'
ctx.fillText('¶', width/2, 0)
// draw a background behind the clipped text
ctx.globalCompositeOperation = 'destination-over'
ctx.fillStyle = '#182927'
ctx.fillRect(0,0, width,height)
// save the graphic...
canvas.saveAs("pilcrow.png")
// ...or use a shorthand for canvas.toBuffer("png")
fs.writeFileSync("pilcrow.png", canvas.png)
// ...or embed it in a string
console.log(`<img src="${canvas.toDataURL("png")}">`)
```
## Installation

@@ -76,9 +37,2 @@

### Dependencies
Nearly everything you need is statically linked into the library.
A notable exception is the [Fontconfig](https://www.freedesktop.org/wiki/Software/fontconfig/) library (and its associated [FreeType](https://www.freetype.org) renderer) which must be installed separately if you’re running on Linux.
### Platform Support

@@ -93,9 +47,14 @@

- Linux (x86)
- macOS (x86 & Apple silicon)
- Windows (x86)
- Linux (x64, arm64, & armhf)
- macOS (x64 & Apple silicon)
- Windows (x64)
Nearly everything you need is statically linked into the library. A notable exception is the [Fontconfig](https://www.freedesktop.org/wiki/Software/fontconfig/) library which must be installed separately if you’re running on Linux.
### Running in Docker
The library is compatible with Linux systems using glibc 2.24 or later. Currently the `rust-skia` library [will not compile](https://github.com/rust-skia/rust-skia/issues/356) against the [musl](https://musl.libc.org) library used by Alpine Linux—though this may change in the future. For now, if you are setting up a [Dockerfile](https://nodejs.org/en/docs/guides/nodejs-docker-webapp/) that uses [`node`](https://hub.docker.com/_/node) as its basis, you’ll want to set your `FROM` image to one of the (Debian-derived) defaults like `node:16`, `node:14`, `node:12`, `node:buster`, `node:stretch`, or simply:
The library is compatible with Linux systems using [glibc](https://www.gnu.org/software/libc/) 2.24 or later as well as Alpine Linux (x64) and the [musl](https://musl.libc.org) C library it favors. In both cases, Fontconfig must be installed on the system for `skia-canvas` to operate correctly.
If you are setting up a [Dockerfile](https://nodejs.org/en/docs/guides/nodejs-docker-webapp/) that uses [`node`](https://hub.docker.com/_/node) as its basis, the simplest approach is to set your `FROM` image to one of the (Debian-derived) defaults like `node:16`, `node:14`, `node:12`, `node:buster`, `node:stretch`, or simply:
```dockerfile

@@ -112,2 +71,9 @@ FROM node

If you wish to use Alpine as the underlying distribution, you can start with something along the lines of:
```dockerfile
FROM node:alpine
RUN apk update && apk add fontconfig
```
### Compiling from Source

@@ -122,8 +88,56 @@

3. Python 2.7 (used by Skia's [build process](https://skia.org/docs/user/build/))
4. On Linux: Fontconfig, OpenSSL, X11, and Mesa
4. On Linux: Fontconfig and OpenSSL
[Detailed instructions](https://github.com/rust-skia/rust-skia#building) for setting up these dependencies on different operating systems can be found in the ‘Building’ section of the Rust Skia documentation. Once all the necessary compilers and libraries are present, running `npm run build` will give you a usable library (after a fairly lengthy compilation process).
## Example Usage
```js
const {Canvas, loadImage} = require('skia-canvas'),
rand = n => Math.floor(n * Math.random()),
fs = require('fs')
let canvas = new Canvas(600, 600),
ctx = canvas.getContext("2d"),
{width, height} = canvas;
// draw a sea of blurred dots filling the canvas
ctx.filter = 'blur(12px) hue-rotate(20deg)'
for (let i=0; i<800; i++){
ctx.fillStyle = `hsl(${rand(40)}deg, 80%, 50%)`
ctx.beginPath()
ctx.arc(rand(width), rand(height), rand(20)+5, 0, 2*Math.PI)
ctx.fill()
}
// mask all of the dots that don't overlap with the text
ctx.filter = 'none'
ctx.globalCompositeOperation = 'destination-in'
ctx.font='italic 480px Times, DejaVu Serif'
ctx.textAlign = 'center'
ctx.textBaseline = 'top'
ctx.fillText('¶', width/2, 0)
// draw a background behind the clipped text
ctx.globalCompositeOperation = 'destination-over'
ctx.fillStyle = '#182927'
ctx.fillRect(0,0, width,height)
// render to files using a background thread
async function render(){
// save the graphic...
await canvas.saveAs("pilcrow.png")
// ...or use a shorthand for canvas.toBuffer("png")
fs.writeFileSync("pilcrow.png", await canvas.png)
// ...or embed it in a string
console.log(`<img src="${await canvas.toDataURL("png")}">`)
}
render()
// ...or switch into synchronous mode and save from the main thread
canvas.async = false
canvas.saveAs("pilcrow.png")
```
# API Documentation

@@ -130,0 +144,0 @@

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc