0

I want to make graphic with highcharts, I tried to conect it with my data base, but it doesn't work.. I don't know what could be wrong.. here is my code and the table from the data base:

    <!DOCTYPE HTML>
<?php 
    include "conectar.php";

?>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Highcharts Example</title>

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <style type="text/css">
${demo.css}
        </style>
        <script type="text/javascript">
$(function () {
    $('#container').highcharts({
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: 1,//null,
            plotShadow: false
        },
        title: {
            text: 'Browser market shares at a specific website, 2014'
        },
        tooltip: {
            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                    style: {
                        color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                    }
                }
            }
        },
        series: [{
            type: 'pie',
            name: 'Consumidores',
            data: [
            <?php
                $sql = "select * from consumidores";
                        $result = mysql_query($con,$sql);
                        while($row=mysql_fetch_array($result, MYSQL_ASSOC)){ ?>

                ['<?php echo $row["Nombre"] ?>',  <?php echo $row["Edad"] ?>],
                    <?php } ?>
            ]
        }]
    });
});



        </script>
    </head>
    <body>
<script src="../../js/highcharts.js"></script>
<script src="../../js/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>

    </body>
</html>

Here is the connection in another .php document:

<?php
$localhost = "localhost";
$my_user = "root";
$my_password = "propio";
$my_db = "mercado";
$conectado = false;
$con="";

    $con = mysql_connect("$localhost","$my_user","$my_password","$my_db");

 ?> 

and here is my table:

CREATE TABLE `consumidores` (
    `ID_consumidor` INT(10) NOT NULL AUTO_INCREMENT,
    `Nombre` VARCHAR(100) NULL DEFAULT NULL COLLATE 'latin1_spanish_ci',
    `Edad` INT(3) NULL DEFAULT NULL,
    `Sexo` VARCHAR(50) NULL DEFAULT NULL COLLATE 'latin1_spanish_ci',
    `SalarioM` VARCHAR(50) NULL DEFAULT NULL COLLATE 'latin1_spanish_ci',
    `PreferenciaCompras` VARCHAR(50) NULL DEFAULT NULL COLLATE 'latin1_spanish_ci',
    `Direccion` VARCHAR(100) NULL DEFAULT NULL COLLATE 'latin1_spanish_ci',
    `Correo` VARCHAR(100) NULL DEFAULT NULL COLLATE 'latin1_spanish_ci',
    `Ciudad` VARCHAR(100) NULL DEFAULT NULL COLLATE 'latin1_spanish_ci',
    `EstadoCivil` VARCHAR(100) NULL DEFAULT NULL COLLATE 'latin1_spanish_ci',
    `TarjetaCredito` VARCHAR(20) NULL DEFAULT NULL COLLATE 'latin1_spanish_ci',
    PRIMARY KEY (`ID_consumidor`)
)
COLLATE='latin1_spanish_ci'
ENGINE=MyISAM
AUTO_INCREMENT=41;

OUTPUT FROM THE BROWSER SOURCE VIEW:

<!DOCTYPE HTML>
<?php 
    include "conectar.php";

?>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Highcharts Example</title>

        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <style type="text/css">
${demo.css}
        </style>
        <script type="text/javascript">
$(function () {
    $('#container').highcharts({
        chart: {
            plotBackgroundColor: null,
            plotBorderWidth: 1,//null,
            plotShadow: false
        },
        title: {
            text: 'Browser market shares at a specific website, 2014'
        },
        tooltip: {
            pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
        },
        plotOptions: {
            pie: {
                allowPointSelect: true,
                cursor: 'pointer',
                dataLabels: {
                    enabled: true,
                    format: '<b>{point.name}</b>: {point.percentage:.1f} %',
                    style: {
                        color: (Highcharts.theme && Highcharts.theme.contrastTextColor) || 'black'
                    }
                }
            }
        },
        series: [{
            type: 'pie',
            name: 'Consumidores',
            data: [
            <?php
                $sql = "select * from consumidores";
                        $result = mysql_query($con,$sql);
                        while($row=mysql_fetch_array($result, MYSQL_ASSOC)){ ?>

                ['<?php echo $row["Nombre"] ?>',  <?php echo $row["Edad"] ?>],
                    <?php } ?>
            ]
        }]
    });
});



        </script>
    </head>
    <body>
<script src="../../js/highcharts.js"></script>
<script src="../../js/modules/exporting.js"></script>

<div id="container" style="min-width: 310px; height: 400px; max-width: 600px; margin: 0 auto"></div>

    </body>
</html>
  • 2
    What does "doesn't work" mean? Also, if this is new code please don't use the deprecated `mysql_` functions. Instead, use either `mysqli_` or `PDO`. – ChrisGPT was on strike Feb 17 '15 at 15:40
  • Do you get any JavaScript errors in the console? – halfer Feb 17 '15 at 15:42
  • I already tried mysqli_ ... and I mean that it doesn't show anything when I try to graph with data from the database – user3365691 Feb 17 '15 at 15:42
  • @halfer no, I don't get any error just a blank page – user3365691 Feb 17 '15 at 15:44
  • Did you specifically **check the console**, though? This is part of your browser, and needs to be opened to see if there were any errors. Do you get any HTML output at all (look at your View Source)? – halfer Feb 17 '15 at 15:45
  • possible duplicate of [PHP's white screen of death](http://stackoverflow.com/questions/1475297/phps-white-screen-of-death) – ChrisGPT was on strike Feb 17 '15 at 15:45
  • @halfer this is what I get on the view source of my browser... check on my edited post above.. – user3365691 Feb 17 '15 at 15:50
  • 1
    your script is not parsed as php... since there are php tags in your html output... – Raphael Müller Feb 17 '15 at 15:54
  • @RaphaelMüller ..How should I code the php part inside the scripts then?? – user3365691 Feb 17 '15 at 15:59
  • you should start by getting your data for your series outside the ajax call just to be sure you have the correct structure. You're making life very difficult this way. – Pogrindis Feb 17 '15 at 16:03
  • What is the filename of the code in your first snippet? If this is not named with a `.php` extension, rename that to start with. As Raphael says, your PHP therein is not executing. – halfer Feb 17 '15 at 16:24

0 Answers0