1

I have this List of apex wrapper class and using the same in creating Bar charts but no bars are appearing at all.

Class:

public class ChartData{
    public String yearMonth {get;set;}
    public Decimal amount {get;set;}

    public ChartData(String yearMonth, Decimal amount ){
        this.yearMonth = yearMonth ;
        this.amount = amount ;
    }
}

VF Page:

 {!chartData}
    <apex:chart data="{!chartData}" height="400" width="500">
        <apex:legend position="top"/>
        <apex:axis type="Numeric" position="left" fields="amount"
                   title="Invoice Amount ($)" />
        <apex:axis type="Category" position="bottom" fields="yearMonth"
                   title="Month/Year">
        </apex:axis>
        <apex:barSeries orientation="vertical" axis="left" xField="yearMonth" yField="amount" />
    </apex:chart>

Output: As you can see, List is having proper data, but bars are not getting generated.

enter image description here

1 Answer 1

2

Is your chartData class a wrapper ? if not then kindly change it as follows and it should work.

Apex Controller

public class ChartDataController{

    public List getMyData() {
        List Sampledata = new List();
        Sampledata.add(new ChartData(100.0,'2016/12'));
        Sampledata.add(new ChartData(460.2,'2016/9'));
        Sampledata.add(new ChartData(100.72,'2016/10'));
        Sampledata.add(new ChartData(280.45,'2015/4'));
        return Sampledata;
    }


    public class ChartData{
        public String yearMonth {get;set;}
        public Decimal amount {get;set;}

        public ChartData(Decimal amount, String yearMonth) {
            this.yearMonth = yearMonth ;
            this.amount = amount ;
        }
    }
}`

Visualforce Page

{!MyData}

<apex:chart data="{!MyData}" height="400" width="500">
    <apex:legend position="top"/>
    <apex:axis type="Numeric" position="left" fields="amount"
               title="Invoice Amount ($)" />
    <apex:axis type="Category" position="bottom" fields="yearMonth"
               title="Month/Year">
    </apex:axis>
    <apex:barSeries orientation="vertical" axis="left" xField="yearMonth" yField="amount" />
</apex:chart>

Result

enter image description here

Question

  1. If this the method that you are already following can you let me know how you are passing values to the wrapper class ?
  2. The charting components make use of JavaScript library, kindly check if you have any warnings or errors in your browser console.
  3. And probably you should take a look into the considerations and limitations for charting, especially the one that states Dynamic (Apex-generated) charting components are not supported at this time.

Reference : https://developer.salesforce.com/docs/atlas.en-us.pages.meta/pages/pages_charting_limitations.htm

1
  • I figured out the issue, it was bootstrap plugin which was causing the issue. Once i removed it, bar are drawn as expected. Thanks for response by the way. Commented Jul 21, 2016 at 1:25

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .