zaterdag 26 december 2015

Stencyl : Drawing an ellipse / circle inside a Rectangle

Graphics : Drawing an Ellipse inside a rectangle

Using Extension for Drawing Utilities in Stencyl: http://community.stencyl.com/index.php?topic=35352.0

Source: Download for 3.2+ Made by ETH 




The ellipse / circle is being drawn using cosinus and sinus in a 360 loop.

The corners of the ellipse can be found by using this code:

var a=_Counter; 
var i=180; // i=90 quarter, i=180 HalfWay etc..

var w=64;
var h=100;
var x=128;
var y=128;
var tempx = w * Math.cos(i * Utils.RAD);
var tempy = h * Math.sin(i * Utils.RAD);
var templ = Utils.distance(0, 0, tempx, tempy);
var tempa = a + Utils.angle(0, 0, tempx, tempy);
tempx = x + (templ * Math.cos(tempa * Utils.RAD));
tempy = y + (templ * Math.sin(tempa * Utils.RAD));
g.fillRect(tempx, tempy, 10, 10); // Mark the side with a rectangle


2 opmerkingen:

  1. You can calculate them with the centerpoint and half-width/height values. Going 'clockwise' around the rectangle's four points - starting at top left.

    1: X-(W/2) and Y-(H/2) //top left
    2: X+(W/2) and Y-(H/2) //top right
    3: X+(W/2) and Y+(H/2) //bottom right
    4: X-(W/2) and Y+(H/2) //bottom left

    BeantwoordenVerwijderen
  2. Thanks Nathaniel. Interesting approach to use the rectangle for half-width calculations. But due to the angle/rotation it didn't work out in my test. I came up with using the source from ETH to get i=180 route.

    BeantwoordenVerwijderen