O'Reilly logo

Mastering AngularJS Directives by Josh Kurz

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Wrapping the gauge.js file

Many websites have requirements, such as showcasing data in different formats, so that the user can consolidate and consume the data as fast and effectively as possible. Gauges help provide some of this functionality. There are many different gauge libraries available for use in the open source market. For this example, the decision was to go with gauge.js (http://bernii.github.io/gauge.js).

Gauge.js is a simple, canvas-based library that has an easy API for rendering gauges in a wide variety of formats. When coupled with AngularJS, its power becomes focused and intensified. For this implementation, we need to do the following:

  • Render the gauge on a canvas element
  • Attach the value and the options to the $scope function ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required