Node Permanently Moved

    get-media-size

    2.0.1 • Public • Published

    get-media-size

    Get the real size of an <img>, <video>, or <canvas> in the browser.

    gzipped size Travis build status npm version

    It works in IE9+ since it depends on naturalWidth/naturalHeight for the images and videoWidth/videoHeight on videos.

    Install

    npm install --save get-media-size
    import loadImage from 'get-media-size';

    If you don't use node/babel, include this:

    <script src="dist/get-media-size.browser.js"></script>

    Usage

    Async usage

    Use this on images or videos that might not yet be loaded. It only needs a few KB of the media to be loaded, so you'll get the size long before its load event.

    var video = document.querySelector('video');
    getMediaSize(video).then(console.log)
    //==> Promise resolves with {width: 1280, height: 720}

    Sync usage

    Use this on canvas or media that is already loaded, otherwise it'll return {width: 0, height: 0}

    Example with images or videos

    var img = document.querySelector('img');
    console.log(img.complete, getMediaSize.sync(img));
    //==> true, {width: 275, height: 95}

    Example with canvas

    var canvas = document.createElement('canvas');
    var ctx = canvas.getContext('2d');
    var canvasSize = getMediaSize.sync(canvas); // it works with either the canvas element
    var canvasSize = getMediaSize.sync(ctx); // or the context object

    API

    getMediaSize(media[, scale])

    parameter description
    media Type: image or video or canvas or context, required
    The element to read the size from
    scale Type: number default:1
    Convenience feature to transform the size if you're using retina canvas, for example. Optional.
    @returns Type: Promise
    Resolves with an object with width and height of the passed media

    getMediaSize.sync(media[, scale])

    parameter description
    media Matches the getMediaSize() function
    scale Matches the getMediaSize() function
    @returns Type: object
    With width and height of the passed media

    Dependencies

    None! But for the async method you need to polyfill window.Promise in IE9-11

    License

    MIT © Federico Brigante

    Install

    npm i get-media-size

    DownloadsWeekly Downloads

    15

    Version

    2.0.1

    License

    MIT

    Last publish

    Collaborators

    • fregante