Source: core/drawing/engine/vml/vmlEllipse.js

  1. /**
  2.  * @fileoverview VML rendering class representing an ellipse.
  3.  * @private
  4.  */
  6. goog.provide('xrx.vml.Ellipse');
  10. goog.require('xrx.vml.Stylable');
  14. /**
  15.  * VML rendering class representing an ellipse.
  16.  * @param {HTMLElement} The HTML element.
  17.  * @constructor
  18.  * @extends xrx.vml.Stylable
  19.  * @private
  20.  */
  21. xrx.vml.Ellipse = function(element) {
  23.   goog.base(this, element);
  25.   this.rx_;
  27.   this.ry_;
  28. };
  29. goog.inherits(xrx.vml.Ellipse, xrx.vml.Stylable);
  33. /**
  34.  * Sets the center point of this ellipse.
  35.  * @param {number} cx The X coordinate of the centre point.
  36.  * @param {number} cy The Y coordinate of the centre point.
  37.  */
  38. xrx.vml.Ellipse.prototype.setCenter = function(cx, cy) {
  39.   var offsetX = cx - this.rx_;
  40.   var offsetY = cy - this.ry_;
  41.   if (cx !== undefined) this.element_.style['left'] = offsetX + 'px';
  42.   if (cy !== undefined) this.element_.style['top'] = offsetY + 'px';
  43. };
  47. /**
  48.  * Sets the ellipse's major-axis radius.
  49.  * @param {number} rx The radius.
  50.  */
  51. xrx.vml.Ellipse.prototype.setRadiusX = function(rx) {
  52.   this.rx_ = rx;
  53.   this.element_.style['width'] = this.rx_ * 2 + 'px';
  54. };
  58. /**
  59.  * Sets the ellipse's minor-axis radius.
  60.  * @param {number} ry The radius.
  61.  */
  62. xrx.vml.Ellipse.prototype.setRadiusY = function(ry) {
  63.   this.ry_ = ry;
  64.   this.element_.style['height'] = this.ry_ * 2 + 'px';
  65. };
  69. /**
  70.  * Draws this ellipse on the canvas.
  71.  * @param {number} cx X-coordinate of the ellipse's center point.
  72.  * @param {number} cy Y-coordinate of the ellipse's center point.
  73.  * @param {number} rx Major-radius of the ellipse.
  74.  * @param {number} ry Minor-radius of the ellipse.
  75.  * @param {string} fillColor The fill color.
  76.  * @param {number} fillOpacity Opacity of the fill color.
  77.  * @param {string} strokeColor The stroke color.
  78.  * @param {number} strokeWidth The stroke width.
  79.  */
  80. xrx.vml.Ellipse.prototype.draw = function(cx, cy, rx, ry, fillColor,
  81.     fillOpacity, strokeColor, strokeWidth) {
  82.   if (rx !== undefined) this.setRadiusX(rx);
  83.   if (ry !== undefined) this.setRadiusY(ry);
  84.   this.setCenter(cx, cy);
  85.   this.strokeAndFill_(fillColor, fillOpacity, strokeColor, strokeWidth);
  86. };
  90. /**
  91.  * Creates a new ellipse.
  92.  * @param {xrx.vml.Canvas} canvas The parent canvas object.
  93.  */
  94. xrx.vml.Ellipse.create = function(canvas) {
  95.   var element = xrx.vml.createElement('oval');
  96.   element.style['position'] = 'absolute';
  97.   return new xrx.vml.Ellipse(element);
  98. };