0

buenas tardes estoy tratando de usar la grafica de tipo pirámide para añadirla a un código donde ya tengo las graficas de barras y pie pero en cuanto intento añadir la grafica de pirámide no se muestra. intente hacer que se mostrara en un archivo aparte de mi proyecto pero ni ahí logro hacer que se muestre.

<!DOCTYPE html>

 <html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="https://code.highcharts.com/highcharts.js">                           </script>
    <script src="https://code.highcharts.com/modules/funnel.js"></script>
    <script src="https://code.highcharts.com/modules/exporting.js"></script>
    <script src="https://code.highcharts.com/modules/export-data.js"></script>
    <script>
        Highcharts.chart('container', {
chart: {
    type: 'pyramid'
},
title: {
    text: 'Sales pyramid',
    x: -50
},
plotOptions: {
    series: {
        dataLabels: {
            enabled: true,
            format: '<b>{point.name}</b> ({point.y:,.0f})',
            softConnector: true
        },
        center: ['40%', '50%'],
        width: '80%'
    }
},
legend: {
    enabled: false
},
series: [{
    name: 'Unique users',
    data: [
        ['Website visits',      15654],
        ['Downloads',            4064],
        ['Requested price list', 1987],
        ['Invoice sent',          976],
        ['Finalized',             846]
    ]
}]
 });
    </script>

</head>
<body>
    <?php
    echo 'hola';
    ?>
<div id="container" style="min-width: 410px; max-width 600px; height: 400px; margin: 0 auto"></div>

</body>
</html>

en consola me sale lo siguiente Error: Highcharts error #13: www.highcharts.com/errors/1 pero no entiendo porque si seguí los pasos del demo de la pagina de highcharts

1 respuesta 1

0

Aqui te dejo la solucion pero en sencillo pasos te falto agregar libreria jquery y la funcion de cargar cuando se inicie la pagina

$(document).ready(function(){

<!DOCTYPE html>

 <html>
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="https://code.highcharts.com/highcharts.js">                           </script>
    <script src="https://code.highcharts.com/modules/funnel.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src="https://code.highcharts.com/modules/exporting.js"></script>
    <script src="https://code.highcharts.com/modules/export-data.js"></script>
    
    <script>
    $(document).ready(function(){
        Highcharts.chart('container', {
chart: {
    type: 'pyramid'
},
title: {
    text: 'Sales pyramid',
    x: -50
},
plotOptions: {
    series: {
        dataLabels: {
            enabled: true,
            format: '<b>{point.name}</b> ({point.y:,.0f})',
            softConnector: true
        },
        center: ['40%', '50%'],
        width: '80%'
    }
},
legend: {
    enabled: false
},
series: [{
    name: 'Unique users',
    data: [
        ['Website visits',      15654],
        ['Downloads',            4064],
        ['Requested price list', 1987],
        ['Invoice sent',          976],
        ['Finalized',             846]
    ]
}]
 });
 });
    </script>

</head>
<body>
    <?php
    echo 'hola';
    ?>
<div id="container" style="min-width: 410px; max-width 600px; height: 400px; margin: 0 auto"></div>

</body>
</html>

1
  • muchas gracias por fin funciono el 21 jun. 2019 a las 21:14

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.