Question

首先，我不知道我的问题的标题是否值得给出答案，因此我对它进行了充分的思考，以表述它，希望我可以指望有人的支持。我有以下代码，我需要在第一级显示年份（x轴），而现在显示一个数字（y轴）只是一种测试模式，在第二级中我想要显示部门（x轴）和一个数字（y轴）为此，我有三个涉及上述内容的表格。 table

table Relational table

我向您展示了一个可以为您提供更大前景的基础，并不是因为事实是我已经控制了它，并且也没有给我带来麻烦。

问题是要在演示中显示该表的值：https://www.highcharts.com/demo/column-drilldown到目前为止，我没有问题可以显示第一级，但可以更深入地进入第二级，我遇到了问题如何创建系列以便可以显示。这是我在控制台中看到的第一级内容，但是我知道在向下钻取系列中有问题，但是我不知道它可能是什么。

我留下了我正在使用的代码。

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>Practica</title>
	<link rel="stylesheet" href="css/bootstrap.css">
	<link rel="stylesheet" href="css/bootstrap-theme.min.css">

	<script src="js/jquery.min.js"></script>
	<script src="js/highcharts.js"></script>
	<script src="js/highcharts-3d.js"></script>
	<script src="js/highcharts-more.js"></script>
	<script src="js/exporting.js"></script>
	<script src="js/export-data.js"></script> 
	<script src="js/data.js"></script>
	<script src="js/drilldown.js"></script>
	<script src="js/bootstrap.min.js"></script>
</head>
<body>
	<div class="container-fluid">
		<div id="container" style="min-width: 310px; height: 400px; margin: 0 auto"></div>
	</div>

</body>
</html>
<script type="text/javascript">
// Create the chart
Highcharts.chart('container', {
    chart: {
        type: 'column'
    },
    title: {
        text: 'Practica. January, 2015 to May, 2015'
    },
    subtitle: {
        text: 'Click the columns to view versions. Source: <a href="http://netmarketshare.com">netmarketshare.com</a>.'
    },
    xAxis: {
        type: 'category'
    },
    yAxis: {
        title: {
            text: 'Total percent market share'
        }

    },
    legend: {
        enabled: false
    },
    plotOptions: {
        series: {
            borderWidth: 0,
            dataLabels: {
                enabled: true,
                format: '{point.y:.1f}%'
            }
        }
    },

    tooltip: {
        headerFormat: '<span style="font-size:11px">{series.name}</span><br>',
        pointFormat: '<span style="color:{point.color}">{point.name}</span>: <b>{point.y:.2f}%</b> of total<br/>'
    },
    <?php  
        include 'conexion/conexion.php';
        $query = "
            SELECT 
            r.var_numerador_mujeres_casadas,
            a.mujeres_anio_casadas 
            FROM resumen_mujeres_casadas r 
            INNER JOIN mujeres_anios_casadas a ON r.id_mujeres_anios_casadas = a.id_mujeres_anios_casadas
        ";

        $query2 = "
            SELECT 
                r.var_denominador_mujeres_casadas, 
                a.mujeres_anio_casadas, 
                d.nombre_departamento 
            FROM 
                resumen_mujeres_casadas r 
            INNER JOIN departamentos_mujeres_casadas d
                 ON r.id_departamento = d.id_departamento 
            INNER JOIN mujeres_anios_casadas a 
                ON r.id_mujeres_anios_casadas = a.id_mujeres_anios_casadas 
            ORDER BY nombre_departamento ASC
        ";
        $result = mysqli_query($conexion_mysql, $query);
        $result2 = mysqli_query($conexion_mysql, $query2);

        if ($result && $result2) 
        {
            $arrayData= array();
            $arrayData2=array();

            while ($row = mysqli_fetch_array($result, MYSQLI_ASSOC)) 
            {
                array_push($arrayData, array(
                    "name"         => $row['mujeres_anio_casadas'],
                    "y"            => (int)$row['var_numerador_mujeres_casadas'],
                    "drilldown"    => $row['mujeres_anio_casadas']
                ));        
            }

            while ($row2 = mysqli_fetch_array($result2, MYSQLI_ASSOC)) 
            {
                
                array_push($arrayData2,array(
                    "name"  => $row2['nombre_departamento'],
                    "id"    => $row2['mujeres_anio_casadas'],
                    "data"     => (int)$row2['var_denominador_mujeres_casadas']
                ));
                
            }

        }//FIN DEL IF RESULT
    ?>
    series: [{
        name: 'Brands',
        data: <?php print $var = json_encode($arrayData); ?>
    }],
    drilldown: {
        series: <?php print $var2 = json_encode($arrayData2); ?>//FIN DE TODA LA SERIE PARA EL DRILLDOWN
    }//FIN DEL DRILLDOWN, POR LO QUE HEMOS VISTO ESTO SERA EL LIMITE
});
</script>

data

grafica

如何为Highcharts深入分析正确构建系列

0 个答案: