CODEWITHSUNDEEP
javascriptjsongoogle-visualization
mancmanomyst
mancmanomyst

Reputation: 2118

Google Charts Pie chart displaying Other 100% rather than actual values

I'm using google charts API to draw a pie chart. The pie chart is generated dynamically with an ajax call to an API I setup and it was working but when I started adding more data, suddenly the pie chart went from displaying each segment to displaying a chart with one value - Other.

Here is the json that's coming back from the server

{
    "cols" : [{
            "id" : "",
            "label" : "Team",
            "type" : "string"
        }, {
            "id" : "",
            "label" : "Steps",
            "type" : "number"
        }
    ],
    "rows" : [{
            "c" : [{
                    "v" : "Draper",
                    "f" : null
                }, {
                    "v" : "626528",
                    "f" : null
                }
            ]
        }, {
            "c" : [{
                    "v" : "Sterling",
                    "f" : null
                }, {
                    "v" : "539165",
                    "f" : null
                }
            ]
        }, {
            "c" : [{
                    "v" : "Pryce",
                    "f" : null
                }, {
                    "v" : "557399",
                    "f" : null
                }
            ]
        }, {
            "c" : [{
                    "v" : "London",
                    "f" : null
                }, {
                    "v" : "807470",
                    "f" : null
                }
            ]
        }, {
            "c" : [{
                    "v" : "Lynx Local",
                    "f" : null
                }, {
                    "v" : "428814",
                    "f" : null
                }
            ]
        }, {
            "c" : [{
                    "v" : "Havas Health Software",
                    "f" : null
                }, {
                    "v" : "375235",
                    "f" : null
                }
            ]
        }
    ]
}

This is my javascript to load the chart

var jsonData = $.ajax({
    url: "/ChartData/OverallSteps",
    async: false
}).responseText;

var pieData = new google.visualization.DataTable(jsonData);

var pieOptions = {
    width: 600, height: 320, 'legend': { position: 'right',alignment:'center' },is3D: true,sliceVisibilityThreshold: 1/10000, chartArea: {left:0,top:0}
};

var pieChart = new google.visualization.PieChart(document.getElementById('teamPieChart'));
pieChart.draw(pieData, pieOptions);

As you can see, I've tried setting the sliceVisibilityThreshold per this Google Pie Chart not Showing All Data Rows but that doesn't seem to be the problem either. There are only 6 series so it should be fine. Can anyone see what's going on?

Upvotes: 2

Views: 1787

Answers (1)

asgallant
asgallant

Reputation: 26330

The problem is that you are entering your numbers as strings, which isn't valid:

"v" : "626528"

should be:

"v" : 626528

Upvotes: 5

Related Questions