Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Tenho esse gráfico em pizza e uma lista de dados de empresas que estão em na url http://servicosweb.ibge.gov.br/GetStatus.ashx . Preciso colocar esses dados no gráfico, que daria como resultado 28 empresas online e 0 offline. Não tenho muito conhecimento em AJAX, gostaria de uma luz para realizar isso
<div class ="container">
<body>
<center> <h1>Status das empresas </h1> <br> </center>
<div><canvas id="grafico" width="200" height="40"></canvas> </div>
</body>
</div>
var ctx = document.getElementById("grafico").getContext('2d');
var pizza = new Chart(ctx, {
type: 'pie',
data: {
labels: ["Serviços online", "Serviços offline"],
datasets: [{
backgroundColor: [
"#3498db",
"#000000",
],
// id: 'gráfico',
data: data,
options: {
animation:{
animateScale:true
}
}
}]
}
});}
à princípio é só teste, mas você não conseguiu visualizar? Caso não tenha, são esses
[{"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}]
Tentei mudar para o JSON, mas ainda tem algo faltando.
var ctx = document.getElementById("grafico").getContext('2d');
var pizza = new Chart(ctx, {
type: 'pie',
data: {
labels: ["Serviços online", "Serviços offline"],
datasets: [{
backgroundColor: [
"#3498db",
"#000000",
],
id: 'grafico',
data: data,
options: {
animation: {
animateScale: true
}
}
}]
}
(function() {
var serviçosWebAPI = "http://servicosweb.ibge.gov.br/GetStatus.ashx";
$.getJSON(serviçosWebAPI)
.done(function(data) {
$.each(data.items, function(item) {
$("<div>").attr("src", item.Nome, item.Status).appendTo("#grafico");
console.log("Serviços operantes");
})
.fail(function(data) {
console.log("Serviços inoperantes");
})
})
})
});Não uses caracteres especiais (como ç) nos nomes das variáveis.
Dá algum erro na consola?
>
6 minutos atrás, wootzor disse:
Não uses caracteres especiais (como ç) nos nomes das variáveis.
Dá algum erro na consola?
Nem dá, mas o gráfico ainda não aparece
Experimenta assim.
>
8 minutos atrás, wootzor disse:
Experimenta assim.
Ficou muito bom, mas teria como colocar dessa mesma forma, só que em vez dos dados estarem no código, colocar apenas a url? Isso está sendo exigido
você disse para substituir o array pelo $.getJSON(), aquele meu está certo então ou falta algo?
Experimenta desta forma. Não consegui testar porque não consigo aceder à página, mas deverá funcionar.
O Web Service está acessível? Não consegui aceder ao endereço.
Atenção que, aparentemente, os dados têm de seguir um determinado formato.