Family Chart

Family Chart is a powerful D3.js-based visualization library for creating beautiful, interactive family trees.

	🎯 Start with Examples Browse pre-built examples and customize them to match your needs. Perfect for quick implementation and learning the library.
🛠️ Visual Builder Complete configuration panel to customize your family tree. Add fields, adjust styling, configure layout options, and generate code for React, Vue, HTML, and JSON.
	🏛️ WikiData Integration See the library in action with real historical family trees. Explore the British Royal Family, Einstein, Leonardo da Vinci, and many other celebrity family trees.

🚀 Framework Support

Family Chart works seamlessly with all major JavaScript frameworks and vanilla JavaScript:

Pro Tip: Use the Visual Builder to generate framework-specific code automatically!

Features

• 🌳 Interactive Family Trees - Zoom, pan, and navigate through complex family structures
• 🎨 Customizable Styling - Full control over colors, fonts, and layout
• ⚡ Framework Agnostic - Works with React, Vue, Angular, Svelte, or vanilla JavaScript
• 🎯 TypeScript Support - Full type definitions included
• 📊 D3.js Powered - Built on the powerful D3.js visualization library
• 🎯 Easy to Use - Simple API with many examples
• 🔄 Real-time Updates - Dynamic tree updates and modifications
• 🎨 Multiple Card Types - SVG and HTML card components

Documentation

API Reference

• Chart API - Main chart class and methods
• EditTree API - Edit functionality and form management
• Card API - Card components and customization

Guides

• Installation & Quick Start - Get started in minutes
• Data Format - Understanding the data structure
• Getting Started Guide - Complete setup and configuration guide

Examples

• Live Examples - Interactive examples and demos
• Visual Builder - Code generator and configuration tool

Support & Feedback

Reporting Issues

• Bug Reports: Use the issue tracker to report bugs
  • Include steps to reproduce the issue
  • Provide browser and version information
  • Add screenshots if applicable
• Feature Requests: Contact me directly at [email protected] for feature requests

License

Distributed under the MIT License. See LICENSE.txt for more information.

Contact

Email: [email protected]

Project Link: https://github.com/donatso/family-chart