constructor(width, height, opt_domHelper) {
    super(opt_domHelper);

    /**
     * The width in pixels of this component.
     * @type {number}
     * @private
     */
    this.width_ = width;

    /**
     * The height in pixels of this component.
     * @type {number}
     * @private
     */
    this.height_ = height;

    /**
     * The underlying graphics.
     * @type {!AbstractGraphics}
     * @private
     */
    this.graphics_ =
        googGraphics.createGraphics(width, height, null, null, opt_domHelper);

    /**
     * Colors to paint the background of certain ranges (optional).
     * @type {!Array<!GaugeColoredRange>}
     * @private
     */
    this.rangeColors_ = [];

    /**
     * The minimal value that can be displayed.
     * @private
     * @type {number}
     */
    this.minValue_ = 0;

    /**
     * The maximal value that can be displayed.
     * @private
     * @type {number}
     */
    this.maxValue_ = 100;

    /**
     * The number of major tick sections.
     * @private
     * @type {number}
     */
    this.majorTicks_ = 5;

    /**
     * The number of minor tick sections in each major tick section.
     * @private
     * @type {number}
     */
    this.minorTicks_ = 2;

    /**
     * The current value that needs to be displayed in the gauge.
     * @private
     * @type {number}
     */
    this.value_ = 0;

    /**
     * The current value formatted into a String.
     * @private
     * @type {?string}
     */
    this.formattedValue_ = null;

    /**
     * The current colors theme.
     * @private
     * @type {?GaugeTheme}
     */
    this.theme_ = null;

    /**
     * Title to display above the gauge center.
     * @private
     * @type {?string}
     */
    this.titleTop_ = null;

    /**
     * Title to display below the gauge center.
     * @private
     * @type {?string}
     */
    this.titleBottom_ = null;

    /**
     * Font to use for drawing titles.
     * If null (default), computed dynamically with a size relative to the
     * gauge radius.
     * @private
     * @type {?Font}
     */
    this.titleFont_ = null;

    /**
     * Font to use for drawing the formatted value.
     * If null (default), computed dynamically with a size relative to the
     * gauge radius.
     * @private
     * @type {?Font}
     */
    this.valueFont_ = null;

    /**
     * Font to use for drawing tick labels.
     * If null (default), computed dynamically with a size relative to the
     * gauge radius.
     * @private
     * @type {?Font}
     */
    this.tickLabelFont_ = null;

    /**
     * The size in angles of the gauge axis area.
     * @private
     * @type {number}
     */
    this.angleSpan_ = 270;

    /**
     * The radius for drawing the needle.
     * Computed on full redraw, and used on every animation step of moving
     * the needle.
     * @type {number}
     * @private
     */
    this.needleRadius_ = 0;

    /**
     * The group elemnt of the needle. Contains all elements that change when
     * the gauge value changes.
     * @type {?GroupElement}
     * @private
     */
    this.needleGroup_ = null;

    /**
     * The current position (0-1) of the visible needle.
     * Initially set to null to prevent animation on first opening of the gauge.
     * @type {?number}
     * @private
     */
    this.needleValuePosition_ = null;

    /**
     * Text labels to display by major tick marks.
     * @type {?Array<string>}
     * @private
     */
    this.majorTickLabels_ = null;

    /**
     * Animation object while needle is being moved (animated).
     * @type {?Animation}
     * @private
     */
    this.animation_ = null;
  }
@param {number} width The width in pixels.
@param {number} height The height in pixels.
@param {!DomHelper=} opt_domHelper The DOM helper object for the
    document we want to render in.