AngularJs directive for https://code.google.com/p/jsgauge/

iobridge.directive.js

/**
   * @ngdoc directive
   * @name ioBridgeDial
   * @restrict E
   *
   * @description
   *
   * @element io-bridge-dial
   * @param {expression} label The name of the device being monitored will be displayed on the dial.
   * @param {expression} value Current dial value.
   * @param {expression} min Minimum value of the band representing operating range.
   * @param {expression} max Maximum value of the band representing operating range.
   *
   * @example
   * <io-bridge-dial label="Auburn" value="72" min="70" max="73"></io-bridge-dial>
   */
  .directive('ioBridgeDial', function ($log) {
    return {
      restrict: 'E',
      scope: {
        label: '=',
        value: '=',
        min: '=',
        max: '='
      },
      template: '<canvas width="100%" height="100%""></canvas>',
      link: function (scope, element, attributes, controller, transcludeFn) {

        function toString() {
          return 'ioBridgeDial(label=' + scope.label + ', value=' + scope.value + ', min=' + scope.min + ', max=' + scope.max + ')';
        }

        var options = {
          value: Number(scope.value) || 0,
          label: scope.label || '',
          unitsLabel: 'F',
          min: 20,
          max: 80,
          majorTicks: 4,
          minorTicks: 3,
          colorOfCenterCircleFill: 'rgba(154, 204, 83, 1)',
          colorOfCenterCircleStroke: 'rgba(47, 67, 128, 1)',
          colorOfText: 'rgba(47, 67, 128, 1)',
          bands: [
            // Leaf Green
            { color: '#55AE3A', from: Number(scope.min), to: Number(scope.max) }
          ]
        };

        var ioGauge = new Gauge(element.find('canvas')[0], options);

        scope.$watch('value', function(newValue, oldValue) {
          ioGauge.setValue(Number(newValue));
        });

        scope.$watchGroup(['min', 'max'], function(newValues, oldValues) {
          // Leaf Green
          options.bands = [{ color: '#55AE3A', from: Number(newValues[0]), to: Number(newValues[1]) }];
          ioGauge.setOptions(options);
          ioGauge.draw();
        });
      }
    }
  });