Javascript array does not work on pie highcharts chart

Asked

Viewed 611 times

1

var conteudodoGrafico = new Array();//cris gráfico
                for(x in data['linha']) {

                     conteudodoGrafico.push('["'+data['linha'][x].nome+'", '+   data['linha'][x].enviado+']'); //cris grafico
}


conteudodoGrafico = ("[ " +conteudodoGrafico+ " ]");
var data_str = JSON.stringify(conteudodoGrafico);

    $('#graficoPizza').highcharts({
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: null,
            plotShadow: false
        },
        title: {
            text: 'Gráfico SMS'
        },
        subtitle: {
                text: 'Relatório'
        },
        tooltip: {
            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    color: '#000000',
                    connectorColor: '#000000',
                    format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                }
            }
        },
       series: [{
                type: 'pie',
                name: 'Quantidade enviados',
                data: JSON.parse(data_str)
              }]
    });
alert(JSON.parse(data_str));

in the Alert JSON.parse(data_str) browser is printing so:

[
    ["AIRPLAN", 2476],
    ["IMPACTO INFORMATICA E TECNOLOGIA", 0],
    ["LINCE ENTREGAS RAPIDAS", 0],
    ["AFRANIO FERREIRA FÉLIX", 1],
    ["FRISSON COMUNICAÇAO E MARKETING LTDA", 0],
    ["GEDALYAS MENEZES DOS SANTOS", 0]
]

Imagem de amostra de como fica o conteudo do grafico com esses valores passados por variavel

javascript highcharts

  • Here at Sopt there are many answers about one was mine: http://answall.com/questions/13526/biblioteca-highcharts-nao-mostra-dados/13535#13535

  • If you can explain better the problem you have in particular and, if possible, show in the code you have already done where this problem is. See in Help Center How to Ask.

  • I tried to play your code and managed to display the chart without any problem http://jsfiddle.net/Hg6TT/

  • The problem is that if you copy what is inside the array ( in Example’s Alert ) right more by putting in the date: JSON.parse(data_str) does not from the following image as it is...

  • 1

    Try to play your error on http://jsfiddle.net, take your jSon and parse it, and edit your question by inserting the jsfidle, or post your jSon complete so we can try to reproduce the error.

  • I am unable to find the error to display it, if you can help me by connecting via teamviwer follow id: 451 586 561 password: 5aj82f thanks!!!

  • give a console.log(data_str) and put here the result

  • it is very complicated to put the whole code here because it is too big and you will not understand anything just wanted to know how the chart ( date: ) has to be done example: it works like this - date: [["AIRPLAN", 2476]] and so it doesn’t work - date: JSON.parse(data_str) when it’s the same thing you understand?

  • let’s go continue this discuss&#227;o in chat

  • var countGrafico = new Array();//Cris graph for(x in data['line']) { countGrafico.push('["'+data['line'][x]. name+'", '+ date['line'][x]. sent+']'); countryGraphic = ("[ " +countryGraphic+ "]); var data_str = JSON.stringify(countryGraphic);

Show 5 more comments

2 answers

1

//I was able to solve this: var conteudodoGrafico = new Array() for(x in data['line']) { conteudodoGrafico.push('["'+data['line'][x]. name+'",'+ date['line'][x]. sent+']'); }

contentGraphic2 = ("[ " +contentGraphic+ " ]");

var chart;
        $(document).ready(function() {
            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'graficoPizza',
                    plotBackgroundColor: null,
                    plotBorderWidth: null,
                    plotShadow: false
                },
                title: {
                    text: 'Gráfico SMS'
                },
                subtitle: {
                    text: 'Relatório de porcentagem de Enviados'
                },
                 tooltip: {
                    pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                },
                plotOptions: {
                    pie: {
                        allowPointSelect: true,
                        cursor: 'pointer',
                        dataLabels: {
                            enabled: false
                        },
                        showInLegend: true
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -10,
                    y: 100,
                    borderWidth: 1
                },
                series: [{
                    type: 'pie',
                    name: 'Quantidade enviados',
                    data: JSON.parse(conteudodoGrafico2)
                }]
            });
        });

0

Since you are using jQuery to generate the chart, also use it to do the parse json.

your series will look like this:

series: [{
    type: 'pie',
    name: 'Quantidade enviados',
    data: jQuery.parseJSON(data_str)
}]

By what I managed to reproduce yours date was still getting a string in place of a array how it is possible to check the playback of the

jsfiddle

Browser other questions tagged javascript highcharts

You are not signed in. Login or sign up in order to post.