Birth chart

by Abhishek Kumar

JavaScript

// Create a canvas element
var canvas = document.createElement("canvas");
// Get the canvas context
var ctx = canvas.getContext("2d");
// Set the canvas width and height
canvas.width = 500;
canvas.height = 500;
// Append the canvas to the document body
document.body.appendChild(canvas);

// Define the zodiac signs and their symbols
var signs = [
  {name: "Aries", symbol: "♈︎"},
  {name: "Taurus", symbol: "♉︎"},
  {name: "Gemini", symbol: "♊︎"},
  {name: "Cancer", symbol: "♋︎"},
  {name: "Leo", symbol: "♌︎"},
  {name: "Virgo", symbol: "♍︎"},
  {name: "Libra", symbol: "♎︎"},
  {name: "Scorpio", symbol: "♏︎"},
  {name: "Sagittarius", symbol: "♐︎"},
  {name: "Capricorn", symbol: "♑︎"},
  {name: "Aquarius", symbol: "♒︎"},
  {name: "Pisces", symbol: "♓︎"}
];

// Define the planets and their symbols
var planets = [
  {name: "Sun", symbol: "☉"},
  {name: "Moon", symbol: "☽"},
  {name: "Mercury", symbol: "☿"},
  {name: "Venus", symbol: "♀"},
  {name: "Mars", symbol: "♂"},
  {name: "Jupiter", symbol: "♃"},
  {name: "Saturn", symbol: "♄"},
  {name: "Uranus", symbol: "♅"},
  {name: "Neptune", symbol: "♆"}
];

// Define the colors for the signs and planets
var colors = {
  Aries: "#FF0000",
  Taurus: "#00FF00",
  Gemini: "#FFFF00",
  Cancer: "#0000FF",
  Leo: "#FFA500",
  Virgo: "#800080",
  Libra: "#FFC0CB",
  Scorpio: "#000000",
  Sagittarius: "#008000",
  Capricorn:"#808080",
  Aquarius:"#00FFFF",
  Pisces:"#800000",
  Sun:"#FFD700",
  Moon:"#FFFFFF",
  Mercury:"#C0C0C0",
  Venus:"#FF69B4",
  Mars:"#DC143C",
  Jupiter:"#8B4513",
  Saturn:"#A9A9A9",
  Uranus:"#7FFFD4",
  Neptune:"#0000CD"
};

// Define the positions of the signs and planets in degrees
// For example, Aries starts at 0 degrees and ends at 30 degrees
// Sun is at 15 degrees Aries, Moon is at 10 degrees Taurus, etc.
var positions = {
  Aries:{start:0, end:30},
  Taurus:{start:30, end:60},
  Gemini:{start:60, end:90},
  Cancer:{start:90, end:120},
  Leo:{start:120, end:150},
  Virgo:{start:150, end:180},
 ...