Demos are not working

[SoN9ne]

Hello,

 

I am a potential customer as FusionCharts seems to be exactly what I am looking for. I am trying to test out the free version before I purchase to make sure it covers all my needs.

 

I am easily able to get the demo from: Building your first chart working but when I try to test your linked charts, I am not successful.

 

I have tried the demo data from: Creating LinkedCharts using the Data String Method but it does not work. I am just getting "Chart type not supported". 

 

I am not really sure what I am doing wrong... 

 

My JavaScript is below: (Using the demo data from the page mentioned above)

jQuery(document).ready(function ($) {

    var _chartData = {
        "chart": {
            "caption": "Top 3 Juice Flavors",
            "subcaption": "Last year",
            "xaxisName": "Flavor",
            "yaxisName": "Amount (In USD)",
            "numberPrefix": "$",
            "theme": "fint",
            "rotateValues": "0"
        },
        "data": [
            {
                "label": "Apple",
                "value": "810000",
                "link": "newchart-xml-apple"
            },
            {
                "label": "Cranberry",
                "value": "620000",
                "link": "newchart-xml-cranberry"
            },
            {
                "label": "Grapes",
                "value": "350000",
                "link": "newchart-xml-grapes"
            }
        ],
        "linkeddata": [
            {
                "id": "apple",
                "linkedchart": {
                    "chart": {
                        "caption": "Apple Juice - Quarterly Sales",
                        "subcaption": "Last year",
                        "xaxisname": "Quarter",
                        "yaxisname": "Amount (In USD)",
                        "numberprefix": "$",
                        "theme": "fint",
                        "rotateValues": "0"
                    },
                    "data": [
                        {
                            "label": "Q1",
                            "value": "157000"
                        },
                        {
                            "label": "Q2",
                            "value": "172000"
                        },
                        {
                            "label": "Q3",
                            "value": "206000"
                        },
                        {
                            "label": "Q4",
                            "value": "275000",
                            "rotateValues": "0"
                        }
                    ]
                }
            },
            {
                "id": "cranberry",
                "linkedchart": {
                    "chart": {
                        "caption": "Cranberry Juice - Quarterly Sales",
                        "subcaption": "Last year",
                        "xaxisname": "Quarter",
                        "yaxisname": "Amount (In USD)",
                        "numberprefix": "$",
                        "theme": "fint",
                        "rotateValues": "0"
                    },
                    "data": [
                        {
                            "label": "Q1",
                            "value": "102000"
                        },
                        {
                            "label": "Q2",
                            "value": "142000"
                        },
                        {
                            "label": "Q3",
                            "value": "187000"
                        },
                        {
                            "label": "Q4",
                            "value": "189000"
                        }
                    ]
                }
            },
            {
                "id": "grapes",
                "linkedchart": {
                    "chart": {
                        "caption": "Grape Juice - Quarterly Sales",
                        "subcaption": "Last year",
                        "xaxisname": "Quarter",
                        "yaxisname": "Amount (In USD)",
                        "numberprefix": "$",
                        "theme": "fint",
                        "rotateValues": "0"
                    },
                    "data": [
                        {
                            "label": "Q1",
                            "value": "45000"
                        },
                        {
                            "label": "Q2",
                            "value": "72000"
                        },
                        {
                            "label": "Q3",
                            "value": "95000"
                        },
                        {
                            "label": "Q4",
                            "value": "108000"
                        }
                    ]
                }
            }
        ]
    };


    FusionCharts.ready(function () {

        var chart = new FusionCharts(_chartData);
        chart.render("chart_div");

    });

});

I am including the following FusionChart files:

• fusioncharts.js
• fusioncharts.charts.js        

• fusioncharts.powercharts.js

• fusioncharts.widgets.js
• fusioncharts.theme.fint.js

I am using version: 3.10.1

 

I am not getting any console errors. Just a white image saying "Chart type not supported". 

 

In fact, I get this a lot when testing with many of the demos that are on your site.

 

I have browser cache disabled and emptied.

 

Look forward to a solution.

 

Thanks

Edited April 9, 2016 by SoN9ne

[SoN9ne]

I have played with this for 2 days now and still no luck.

 

Not having a reply in 2 days is making me reconsider about purchasing FushionCharts, since it appears to be broken...

[Gagan Sikri]

Hi

 

I checked the code you are implementing - you have not declared chart type and data format which is the reason you are getting error message `Chart type not supported`.

 

You have to declare chart type, width, height, dataFormat (XML or JSON) and dataSource (`_chartData` in your case) inside chart object to render the charts.

 

Please refer to this JSFiddle sample with updated code: http://jsfiddle.net/LE3Fa/95/

[SoN9ne]

Thank you for the information. I was following the demos and I didn't see anything about those fields when I was copy and pasting. Just an issue with a new user learning the API.

 

This is now resolved.