0

Necesito colocar estos resultados en una sola barra que la roja este junto a la verde adjunto la imagen estoy utilizando la librería de highcharts

introducir la descripción de la imagen aquí

Estoy utilizando el siguiente código:

chartCPU = new Highcharts.chart('graf', 
                {
                    chart: {
                        type: 'column'
                    },
                    title: {
                        text: 'Paises visitados'
                    },
                    subtitle: {
                        text: ''
                    },
                    xAxis: {
                        gridLineWidth: 1,
                        categories: 
                        [
                            <?php
                                foreach($param['PAIS'] as $PAIS)
                                {
                                    echo "'$PAIS',";
                                }
                            ?>
                        ]
                    },
                    yAxis: 
                    [
                        {
                            min: 0,
                            title: 
                            {
                                text: '',
                            }
                        }
                    ],
                    plotOptions: {
                        column: {
                            pointPadding: 0.1,
                            borderWidth: 1
                        }
                    },
                    credits: {
                      enabled: false
                    },
                    tooltip: {
                        split: true
                    },
                    series: 
                    [
                        {
                            name: 'EXITOSO',
                            data: 
                            [
                                <?php 
                                    for ($j=0; $j < count($param['TOTAL_EXITOSO']) ; $j++) 
                                    { 
                                        echo $param['TOTAL_EXITOSO'][$j].','; 
                                    }
                                ?>
                            ],
                            color: '#006400',
                            cursor: 'pointer'
                        },
                        {
                            name: 'NO EXITOSO',
                            data: 
                            [
                                <?php 
                                    for ($l=0; $l < count($param['TOTAL_NOEXITOSO']) ; $l++) 
                                    { 
                                        echo $param['TOTAL_NOEXITOSO'][$l].','; 
                                    }
                                ?>
                            ],
                            color: '#B22222',
                            cursor: 'pointer'
                        }
                    ]
                });

2 respuestas 2

1

por lo que veo solo te falta agregar lo siguiente

plotOptions: {
    series: {
        stacking: 'normal'
    }
},

Espero te sirva, saludos.

4
  • serías tan amable de indicar por que esto es lo que falta?
    – user75901
    Commented el 22 nov. 2018 a las 14:44
  • La opción de stacking, permite apilar las barras y al indicar el valor 'normal' te permitirá apilar por valor, tambien puedes usar el valor 'percent', espero esta explicación te sirva, saludos Commented el 22 nov. 2018 a las 14:51
  • @GerardoPerezThompson ¿no consideras que la explicación deba estar adjunta a tu respuesta?
    – Gibrán
    Commented el 22 nov. 2018 a las 15:19
  • Si, una disculpa, recién es mi segundo día utilizando la plataforma aun no estoy muy familiarizado a la forma de responder, sin duda lo tomare en cuenta a partir de ahora, que tengan buen día. Commented el 22 nov. 2018 a las 15:25
0

Como primera medida deberas indicar que series quieres apilar. Esto se logra con el atributo stack, de la siguiente manera:

series: {
    stack: id
}

En tu caso te quedaria algo asi:

                series: 
                [
                    {
                        name: 'EXITOSO',
                        data: 
                        [
                            <?php 
                                for ($j=0; $j < count($param['TOTAL_EXITOSO']) ; $j++) 
                                { 
                                    echo $param['TOTAL_EXITOSO'][$j].','; 
                                }
                            ?>
                        ],
                        color: '#006400',
                        cursor: 'pointer',
                        stack: 0
                    },
                    {
                        name: 'NO EXITOSO',
                        data: 
                        [
                            <?php 
                                for ($l=0; $l < count($param['TOTAL_NOEXITOSO']) ; $l++) 
                                { 
                                    echo $param['TOTAL_NOEXITOSO'][$l].','; 
                                }
                            ?>
                        ],
                        color: '#B22222',
                        cursor: 'pointer',
                        stack: 0
                    }
                ]

Aqui la API de referencia: https://api.highcharts.com/highstock/series.column.stack

Luego, como bien te dijo Gerardo, deberas indicar si queres apilar por valor o por porcentaje. En tu caso quedaría algo asi:

                plotOptions: {
                    series: {
                        stacking: 'normal'
                    },
                    column: {
                        pointPadding: 0.1,
                        borderWidth: 1
                    }
                },

Te dejo también la API de referencia: https://api.highcharts.com/highstock/series.column.stacking

Aquí un ejemplo: http://jsfiddle.net/ZottoSL/0banf6sw/

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.