Activity Forums Salesforce® Discussions How can I show/create simple Bar Graph on a Salesforce Visualforce Page?

  • Abhinav

    Member
    August 11, 2016 at 3:58 pm

    Hi Pranav,

    Please refer to the code below :-

    <apex:page controller="AccountRec_Barchart" docType="html-5.0" title="Bar chart" >
    <apex:form >

    <apex:outputText value="from Date">
    </apex:outputText>
    <apex:input type="date" value="{!fromdate}"/>
    <apex:outputText value="ToDate"></apex:outputText>
    <apex:input type="date" value="{!todate}" />
    <apex:commandButton value="submit" action="{!submit}" reRender="chartid" />

    </apex:form>

    <apex:chart id="chartid" height="300" width="650" data="{!data}" colorSet="2A98DC" resizable="true" >

    <apex:axis type="Numeric" position="left" fields="count" title="Recordcount" minimum="0" grid="false" />
    <apex:axis type="Category" position="bottom" fields="billingcityname" title="billingcity" />
    <apex:barSeries orientation="vertical" axis="left" xField="billingcityname" yField="count">

    </apex:barSeries>

    </apex:chart>

    <apex:chart height="300" width="650" data="{!data}" resizable="true">
    <apex:pieSeries tips="true" dataField="count" labelField="billingcityname"></apex:pieSeries>
    <apex:legend position="right"/>
    </apex:chart>

    </apex:page>

     

    public class AccountRec_Barchart
    {
    public date fromDate{set;get;}
    public date todate{set;get;}
    public list<aggregateresult> listaggregate= new list<aggregateresult>();
    public list<barchartdata> lb = new list<barchartdata>();

    public void submit()
    {
    listaggregate = [select billingcity, COUNT(Id) n
    from Account
    where createddate > : fromDate and createddate <:todate
    group by billingcity
    HAVING billingcity like '%'];
    }

    public barchartdata[] getdata()
    {
    system.debug('getdata');
    barchartdata[] datachart = new barchartdata[]{};

    for(aggregateresult a :listaggregate)
    {
    datachart.add(new barchartdata(a));
    }
    return datachart;
    }

    // wrapper class
    public class barchartdata
    {
    public string city {set;get;}
    public integer count{set;get;}
    public string billingcityname{set;get;}
    barchartdata(aggregateresult result)
    {
    this.count = (Integer) result.get('n');
    this.city = (string) result.get('billingcity');
    this.billingcityname = city+'';
    }
    }
    }

    I hope this helps.

     

Log In to reply.

Popular Salesforce Blogs

Popular Salesforce Videos