I've encountered an issue while using the Google Charts API to create a dynamic pie chart. Initially, everything was working smoothly as the chart displayed each segment accurately. However, upon adding more data, the pie chart started showing only one value - 'Other'.
Here is the JSON response 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 the JavaScript code used 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);
Despite attempting to adjust the sliceVisibilityThreshold, I still couldn't resolve the issue. With only 6 series in total, the problem persists. Can anyone identify what might be causing this?