title: find coordinates to draw square inside circle
body: <p>How to compute the starting co-ordinates to draw a square inside a cirle?</p>
  
  <p>Function Draws the circular spectrum . 
  Now help me to find the starting coordinates to  draw the rectangle inside the circle</p>
  
  <pre><code>Gradient.prototype.renderSpectrum = function() {
      var radius = this.width / 2;
      var toRad = (2 * Math.PI) / 360;
      var step = 1 / radius;
  
     this.ctx.clearRect(0, 0, this.width, this.height);
  
      for(var i = 0; i &lt; 360; i += step) {
          var rad = i * toRad;
          this.ctx.strokeStyle = 'hsl(' + i + ', 100%, 50%)';
          this.ctx.beginPath();
          this.ctx.moveTo(radius, radius);
          this.ctx.lineTo(radius + radius * Math.cos(rad), radius + radius * Math.sin(rad));
          this.ctx.stroke();
      }
  
     this.ctx.fillStyle = 'rgb(255, 255, 255)';
     this.ctx.beginPath();
     this.ctx.arc(radius, radius, radius * 0.8, 0, Math.PI * 2, true);
     this.ctx.closePath();
     return this.ctx.fill();
  
  }
  </code></pre>
  
  <p>Function to draw the square</p>
  
  <pre><code>Gradient.prototype.renderGradient = function() {
    var color, colors, gradient, index, xy, _i, _len, _ref, _ref1;
    xy = arguments[0], colors = 2 &lt;= arguments.length ? __slice.call(arguments, 1) : [];
    gradient = (_ref = this.ctx).createLinearGradient.apply(_ref, [0, 0].concat(__slice.call(xy)));
    gradient.addColorStop(0, (_ref1 = colors.shift()) != null ? _ref1.toString() : void 0);
    for (index = _i = 0, _len = colors.length; _i &lt; _len; index = ++_i) {
      color = colors[index];
      gradient.addColorStop(index + 1 / colors.length, color.toString());
    }
    this.ctx.fillStyle = gradient;
    this.renderSpectrum();
    return this.ctx.fillRect(?, ?, this.width * 0.8, this.height * 0.8);
  };
  </code></pre>