jonobr1 / two.js

A renderer agnostic two-dimensional drawing api for the web.
https://two.js.org
MIT License
8.31k stars 455 forks source link

I am trying to display some text in this loop it just displays "Undefined" can you help ? please #619

Closed putilatex closed 2 years ago

putilatex commented 2 years ago
var eclipticWidth = 0.75;
var ast = [ "a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l" ];

function zodiacSigns() {

  function toRadians(x) {
    return x * (Math.PI / 180);
  }

  function toDegRad(x, f) { return toRadians(x * f); }

  let i = 0;
  while (i <= 60) {

    var Lep = Re - Re * eclipticWidth;
    var f = 12;
    var b = 2.51284;
    var d  = toDegRad(i,f);
    var sd = Math.sin(d);
    var a  = 0.275 * clockRadius;
    var Re = (a * (Math.sqrt((b * b) - (sd * sd)) + Math.cos(d))) - 3.9;

    var factA = hourAries + d;
    var sinfactA = Math.sin(factA);
    var cosfactA = Math.cos(factA);
    var xd = xc + Re * sinfactA;
    var yd = yc - Re * cosfactA;
    var xf = xc + (Re - Lep) * sinfactA;
    var yf = yc - (Re - Lep) * cosfactA;

    var sign = ast[Math.floor(16 - i)];

    var zodiac = new Two.Text(sign , (xd + xf) / 2, (yd + yf) / 2);

    zodiac.family = '"Helvetica"';
    zodiac.weight = "normal";
    zodiac.size = "20";
    zodiac.fill = "#2E8B57";
    zodiac.noStroke = "#2E8B57";

    two.scene.add(zodiac);

    i = i + 2.5;
  }
}

zodiacSigns();
jonobr1 commented 2 years ago

I haven't run your code, but it looks like the culprit is line 31 var sign = ast[Math.floor(16 - i)];. There will only be 16 of 60 entries that could result in an astrological sign. If you'd like to cycle through all signs then using you might want to consider using Modulo like so:

var sign = ast[Math.floor(i % ast.length)];

Hope this helps!