Hello!

I would like to display the actual Account Hierarchy within a Lightning Component on the Lightning Record Page for my Accounts.

I was able to find code to add a Lightning Component that links to the hierarchy, but I want to actually display the hierarchy instead.

Does anyone know how to do this? Below is a screenshot of the code I found and how it looks. Maybe I can edit the existing code to display the hierarchy?

COMPONENT
<aura:component implements="flexipage:availableForRecordHome,force:hasRecordId">
    <div class="slds-section slds-is-open">
        <h3 class="slds-section__title">
            <button aria-controls="expando-unique-id" aria-expanded="true" class="slds-button slds-section__title-action">
                <lightning:icon iconName="utility:switch" alternativeText="" size="x-small" />
                <span class="slds-truncate" title="Section Title"> &nbsp;Account Hierarchy Link</span>
            </button>
        </h3>
        <div aria-hidden="false" class="slds-section__content" id="expando-unique-id">
            &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a onclick="{!c.navigateToAccountHierarchy}">View Account Hierarchy</a>
        </div>
    </div>
</aura:component>

CONTROLLER

({
    navigateToAccountHierarchy: function(cmp, event, helper) {
        var acctId = cmp.get('v.recordId');
        var evt = $A.get("e.force:navigateToComponent");
        evt.setParams({
            componentDef: "sfa:hierarchyFullView",
            componentAttributes: {
                recordId: acctId,
                sObjectName: "Account"
            }
        });
        evt.fire();
    }
})

RESULT