Socket
Socket
Sign inDemoInstall

get-canvas-context

Package Overview
Dependencies
0
Maintainers
1
Versions
3
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

get-canvas-context

gets canvas context by name


Version published
Maintainers
1
Weekly downloads
186,761
decreased by-15.63%

Weekly downloads

Readme

Source

get-canvas-context

stable

Creates a new HTML5 Canvas Context with the given dimensions and options. Returns null if not supported.

Supports 'webgl', 'webgl2' and '2d', handles vendor prefixing, and runs in Node and the Browser.

Install

npm install get-canvas-context --save

Example

var getContext = require('get-canvas-context')

// create a new 50x50 2D canvas
var ctx = getContext('2d', {
  width: 50,
  height: 50
})

// add to DOM
document.body.appendChild(ctx.canvas)

// draw to it
ctx.fillRect(0, 0, 50, 50)

Or, WebGL using an existing canvas:

var canvas = document.createElement('canvas')

var gl = getContext('webgl', {
  canvas: canvas,
  antialias: true
})

if (!gl) {
  throw new Error('webgl not supported')
}

Usage

NPM

ctx = createContext(type, [opt])

Returns a new canvas context for the given type, a string which is either '2d', 'webgl' or 'webgl2'. The options:

  • canvas - an existing canvas element to re-use rather than creating a new one
  • width - if specified, will set the canvas width
  • height - if specified, will set the canvas height
  • {...contextAttributes} any other options for the rendering context, like alpha

Handles vendor prefixing for WebGL contexts. Returns null if we are not in a browser, or if the context is not available, or if there was an error creating the context.

Note: As of the time of writing (Jun 2015), "webgl2" is only supported through special flags in Chrome Canary and FireFox Nightly.

License

MIT, see LICENSE.md for details.

Keywords

FAQs

Last updated on 10 May 2016

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

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

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc