Gallery

Gallery

Explore AstroChart’s capabilities through these live interactive examples. Each demo is rendered in real-time using the actual library — no screenshots.

Radix Chart

A natal chart showing planetary positions and house cusps.

Show Code

import { Chart } from '@astrodraw/astrochart'

const chart = new Chart('chart', 600, 600)
chart.radix(data)

Transit Chart

A transit ring overlaid on a radix chart, showing current planetary transits.

Show Code

import { Chart } from '@astrodraw/astrochart'

const chart = new Chart('chart', 600, 600)
chart.radix(radixData).transit(transitData)

Chart with Aspects

Aspect lines drawn between planets — conjunctions, squares, trines, and oppositions.

Show Code

import { Chart } from '@astrodraw/astrochart'

const chart = new Chart('chart', 600, 600)
chart.radix(data).aspects()

Animated Transit

Watch as the transit positions animate smoothly.

Start Animation

Show Code

import { Chart } from '@astrodraw/astrochart'

const chart = new Chart('chart', 600, 600)
const transit = chart.radix(radixData).transit(transitData)

// animate(targetData, durationSeconds, isReverse, onComplete)
transit.animate(newTransitData, 2, false, () => {
  console.log('animation complete')
})