Not displaying pi chart component on opportunity

Question

`My requirement is to create dynamic pi chart component to count stages on opportunity. Here is my code which displaying only parent component not pi chart which is child one plz help

public class OppPieChartController {

@AuraEnabled public static String getOpportunityJSON(){

   List<opportunity> lstopp = [SELECT Id, stagename FROM opportunity ];
    Map<String,Integer> mapLeadSource = new Map<String,Integer>();

    for(opportunity l : lstopp)
    {
        if(mapLeadSource.containsKey(l.stagename))
        {
            mapLeadSource.put(l.stagename, mapLeadSource.get(l.stagename)+1) ;
        }else{
            mapLeadSource.put(l.stagename, 0) ;
        }
    }
    system.debug('map values--'+mapLeadSource);
    list<RadarDataWrapper> radarData = new list<RadarDataWrapper>();

    for(String key : mapLeadSource.keySet())
    {
       RadarDataWrapper rdw = new RadarDataWrapper();
        rdw.name=key;
        rdw.y=mapLeadSource.get(key);
        radarData.add(rdw);
    }
    system.debug('rdw---'+radarData);
    return System.json.serialize(radarData);
    //return null;
}

/**

Wrapper class to serialize as JSON as return Value
- */ class RadarDataWrapper { @AuraEnabled public String name; @AuraEnabled public integer y;
}

}

<aura:component controller="OppPieChartController" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,force:lightningQuickAction" access="global" >

<ltng:require scripts="{!join(',',$Resource.Highcharts,
                       $Resource.Highchart3D,
                       $Resource.HighchartsExport
                       )}" afterScriptsLoaded="{!c.afterScriptsLoaded}"/>


<aura:attribute name="chartType" type="string"/>
<aura:attribute name="chartTitle" type="string" default="Opportunity by StageName"/>
<aura:attribute name="chartSubTitle" type="string" default="Display Opportunity Count by StageName"/>
<aura:attribute name="xAxisCategories" type="string[]" default="['Qualification','Negotiation/Review','Closed Won','Id. Decision Makers','Proposal/Price Quote','Proposition','Prospecting','Perception Analysis','Needs Analysis']"/>
<aura:attribute name="yAxisParameter" type="string" default="No. of Opportunity"/>
<aura:attribute name="data" type="string"/>



<div class="slds-card">
    <br/>
    <center><b><h1 class="slds-page-header__title slds-truncate slds-align-middle">
        Pictorial Representaion of Opportunity to count StageName</h1></b></center>
    <br/>
    <div class="slds-grid slds-wrap slds-grid--pull-padded">
        <div class="slds-col--padded slds-size--1-of-2 slds-medium-size--2-of-6 slds-large-size--4-of-12 cusdiv">
            <div aura:id="Piechart" style="height: 400px"></div>
        </div>
                </div>
</div>

</aura:component>

<aura:component controller="OppPieChartController" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,force:lightningQuickAction" access="global" >

<ltng:require scripts="{!join(',',$Resource.Highcharts,
                       $Resource.Highchart3D,
                       $Resource.HighchartsExport
                       )}" afterScriptsLoaded="{!c.afterScriptsLoaded}"/>


<aura:attribute name="chartType" type="string"/>
<aura:attribute name="chartTitle" type="string" default="Opportunity by StageName"/>
<aura:attribute name="chartSubTitle" type="string" default="Display Opportunity Count by StageName"/>
<aura:attribute name="xAxisCategories" type="string[]" default="['Qualification','Negotiation/Review','Closed Won','Id. Decision Makers','Proposal/Price Quote','Proposition','Prospecting','Perception Analysis','Needs Analysis']"/>
<aura:attribute name="yAxisParameter" type="string" default="No. of Opportunity"/>
<aura:attribute name="data" type="string"/>



<div class="slds-card">
    <br/>
    <center><b><h1 class="slds-page-header__title slds-truncate slds-align-middle">
        Pictorial Representaion of Opportunity to count StageName</h1></b></center>
    <br/>
    <div class="slds-grid slds-wrap slds-grid--pull-padded">
        <div class="slds-col--padded slds-size--1-of-2 slds-medium-size--2-of-6 slds-large-size--4-of-12 cusdiv">
            <div aura:id="Piechart" style="height: 400px"></div>
        </div>
                </div>
</div>

</aura:component>

Not displaying pi chart component on opportunity

0 Answers0