Family Chart API Documentation - v0.8.1
    Preparing search index...

    Class CardHtmlClass

    CardHtml class - Handles HTML-based card rendering and customization for family tree nodes.

    import * as f3 from 'family-chart'
    const f3Chart = f3.createChart('#FamilyChart', data)
    const f3Card = f3Chart.setCardHtml()  // returns a CardHtml instance
      .setCardDisplay([["first name","last name"],["birthday"]]);
    Index

    Constructors

    constructor

    Properties

    card_dim card_display cardImageField cardInnerHtmlCreator cont defaultPersonIcon mini_tree onCardClick onCardMouseenter onCardMouseleave onCardUpdate store style svg to_transition

    Methods

    getCard onCardClickDefault onEnterPathToMain onLeavePathToMain resetCardDim setCardDim setCardDisplay setCardImageField setCardInnerHtmlCreator setDefaultPersonIcon setMiniTree setOnCardClick setOnCardUpdate setOnHoverPathToMain setStyle unsetOnHoverPathToMain

    Constructors

    Properties

    card_dim: { [key: string]: number | boolean }
    card_display: any
    cardImageField: string
    cardInnerHtmlCreator: undefined | ((d: TreeDatum) => string)
    cont: HTMLElement
    defaultPersonIcon: undefined | ((d: TreeDatum) => string)
    mini_tree: boolean
    onCardClick: any
    onCardMouseenter: undefined | ((e: Event, d: TreeDatum) => void)
    onCardMouseleave: undefined | ((e: Event, d: TreeDatum) => void)
    onCardUpdate: any
    store: Store
    style: "default" | "rect" | "imageCircleRect" | "imageCircle" | "imageRect"
    svg: SVGElement
    to_transition: undefined | string | false

    Methods

    • Parameters

      • style: "default" | "rect" | "imageCircleRect" | "imageCircle" | "imageRect"

      Returns CardHtmlClass

    Settings

    Member Visibility

    On This Page

    Constructors
    Properties
    Methods