Chart Demo Test

Chart Demo Component Test

This page demonstrates the ChartDemo component in all three modes.

Radix Mode

A basic radix (birth) chart showing planetary positions at a specific time.

Show Code

import { Chart } from '@astrodraw/astrochart'

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

Transit Mode

A chart showing both radix (inner) and transit (outer) rings.

Show Code

import { Chart } from '@astrodraw/astrochart'

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

Animation Mode

An animated chart with a button to trigger the animation.

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')
})