Problem with creating pie

[farhan]

Hi, 

I am new to javascript and jChartfx. I am trying to create a pie but get this error

-- crosstabdataprovider cannot be accessed fron undefined. probably the cfx.data object is null

- even if I dont use crosstabdataprovider there is no graph created 

function loadStatsGraph(data) {

    chartStats = new cfx.Chart();

    chartStats.setGallery(cfx.Gallery.Pie);

    var ldata = [{ "Count": 10, "status": "Successful calculation" }, { "Count": 90, "status": "UnSuccessful calculation"}];

    chartStats.setDataSource(ldata);

    var fields = chartStats.getDataSourceSettings().getFields();

    var field1 = new cfx.FieldMap();

    field1.setName("status");

    field1.setUsage(cfx.FieldUsage.RowHeading);

    fields.add(field1);

    var field2 = new cfx.FieldMap();

    field2.setName("Count");

    field2.setUsage(cfx.FieldUsage.ColumnHeading);

    fields.add(field2);

    var crosstab = new cfx.data.CrosstabDataProvider();

    crosstab.setDataSource(chartStats.getDataSource());

    chartStats.setDataSource(crosstab);

    var data = chartStats.getData();

    data.setSeries(1);

    //chartStats.getAllSeries().getPointLabels().setVisible(true);

    var titles = chartStats.getTitles();

    var title = new cfx.TitleDockable();

    title.setText("Build Statistics");

    titles.add(title);

    var divHolder = document.getElementById('divStats');

    chartStats.create(divHolder);

}

 

 

Regards

Farhan 

[JuanC]

What happens when you only execute the first 4/5 lines of code + the chart.create call? Please post all details about error messages you receive, each browser will provide slightly different ways to retrieve the debug/error console. Also post which jchartfx scripts are you including in your page.

As long as you include jchartfx.system.js and ONE of the following (jchartfx.coreVector.js OR jChartFX.coreBasic.js) this code copied from your code should work as expected

chartStats = new cfx.Chart();

chartStats.setGallery(cfx.Gallery.Pie);

var ldata = [{ "Count": 10, "status": "Successful calculation" }, { "Count": 90, "status": "UnSuccessful calculation"}];

chartStats.setDataSource(ldata);

var divHolder = document.getElementById('divStats');

chartStats.create(divHolder);

 

JuanC 

 

[farhan]

Hi Juan,

Thank you for the response.

I managed to solve the issue. The problem was with the UI where I didn't set the div width and height which accomodates the graph control. It was a wrong assumption on my part that the div will automatically size based on graph.

 Best Regards