Animated Lag Radar With JavaScript And SVG – lag-radar

Category: Chart & Graph , Javascript , Recommended | March 29, 2018
Author: mobz
Views Total: 1,679
Official Page: Go to website
Last Update: March 29, 2018
License: MIT

Preview:

Animated Lag Radar With JavaScript And SVG – lag-radar

Description:

lag-radar is an ES6 JavaScript library that renders a dynamic, animated, and SVG based performance radar to visualize slow downs on the web app.

How to use it:

Install the lag-radar.

# NPM
$ npm install lag-radar --save

Import the lag-radar into your module.

import lagRadar from 'lag-radar';

Create a new instance and config the lag radar.

const myRadar = lagRadar({

      // number of frames to draw
      frames: 50,    

      // sweep speed
      speed: 0.0017, 

      // in px
      size: 300,

      // in pix
      inset: 3,

      // where to attatch the radar to
      parent: document.body, 
      
});

Render the lag radar in the document.

myRadar()

You Might Be Interested In:


Leave a Reply