Bom dia, gostaria de colocar em um gráfico Pie Chart os dados oriundos de uma url à partir de ajax, mas estou tendo muitas dificuldades por ser iniciante. Pelo que eu soube, tenho que ler os dados JSON da url e armazenar numa variável, mas não sei como fazer isso. Isso foi o que eu fiz até agora.
<div class ="container">
<body>
<div><canvas id="grafico" width="100" height="20"></canvas> </div>
</body>
</div>
$.ajax({
url: 'http://servicosweb.ibge.gov.br/GetStatus.ashx',
data:data,
success: function(url, data) {
alert(data);
var datachart = JSON.parse(data.Status);
$("div").attr(item.Status ? "on" : "off").appendTo($("#grafico"));
var myChart = new Chart(ctx).Pie(datachart);
var ctx = document.getElementById("grafico").getContext("2d");
myChart = new Chart(ctx, {
type: 'pie',
data: {
labels: ["Serviços online", "Serviços offline"],
datasets: [{
backgroundColor: [
"#1874CD",
"#698B22"
],
data: datachart,
options: {
animation: {
animateScale: true
}
}
}]
}
});
}
});
É provável que vocês não consigam entrar na url, mas é isso que está lá
[{"Nome":"IPP","Status":true},{"Nome":"PAC","Status":true},{"Nome":"PAIC","Status":true},{"Nome":"PAS","Status":true},{"Nome":"PIA","Status":true},{"Nome":"PIAPROD","Status":true},{"Nome":"PIMES","Status":true},{"Nome":"PIMPF","Status":true},{"Nome":"PMCC","Status":true},{"Nome":"PMS","Status":true},{"Nome":"BMOPATATV.GetBMOPATATV","Status":true},{"Nome":"BMOPATATV.GetCountBMOPATATV","Status":true},{"Nome":"CESSAOBM","Status":true},{"Nome":"SETOR","Status":true},{"Nome":"AD.GetData","Status":true},{"Nome":"AD.GetDataDT","Status":true},{"Nome":"AGROAGENCIAS","Status":true},{"Nome":"AGROFASES","Status":true},{"Nome":"AGROFONTES","Status":true},{"Nome":"AGROMUNICIPIOS","Status":true},{"Nome":"AGROOCORRENCIAS","Status":true},{"Nome":"AGROPRODUTOS","Status":true},{"Nome":"AGROQUESTIONARIOSMUNICIPAIS","Status":true},{"Nome":"AGROQUESTIONARIOSUF","Status":true},{"Nome":"AGROQUESTIONARIOSUF","Status":true},{"Nome":"PMC_CRIPTO","Status":true},{"Nome":"BDOCFUNCUE","Status":true},{"Nome":"BM","Status":true}]