时间戳

首页 > 解决方案 > 如何从 2 个表中获取数据并显示到 1 个 chartjs

php - 如何从 2 个表中获取数据并显示到 1 个 chartjs

问题描述

我有两张不同的桌子。

表 1：食物（具有食物名称字段）

表 2：food_details（有食物的数量字段）

两者都通过食物的“id”连接起来。

我创建了一个 chartjs 图表以图表方式显示食物的数量，所以现在该图表已连接到表 2 并显示我的数量和标签为 id。但我的问题是，我想将食物的名称显示为带有数量的标签，但该字段在表 1 中，我不知道如何获取和显示而不是食物的 id，或者即使有可能。

这是我的代码

数据：

<?php 

header('Content-Type: application/json');

define('DB_HOST', 'localhost');
define('DB_USERNAME', 'root');
define('DB_PASSWORD', '');
define('DB_NAME', 'chartjs');

$mysqli = new mysqli(DB_HOST, DB_USERNAME, DB_PASSWORD, DB_NAME);

if(!$mysqli){
    die("Connection failed: " . $mysqli->error);
}

$query = sprintf("SELECT id, available_quantity FROM food_details ORDER BY id");

$result = $mysqli->query($query);

$data = array();
foreach ($result as $row) {
    $data[] = $row;
}

$result->close();

$mysqli->close();

print json_encode($data);

 ?>

图表脚本

<script type="text/javascript">

$(document).ready(function(){
    $.ajax({
        url: "http://localhost/chartjs/data.php",
        method: "GET",
        success: function(data) {
            console.log(data);
            var id = [];
            var available_quantity = [];

            for(var i in data) {
                id.push("id" + data[i].id);
                available_quantity.push(data[i].available_quantity);
            }

            var chartdata = {
                labels: id,
                datasets : [
                    {
                        label: 'Food Storage',
                        backgroundColor: 'rgba(200, 200, 200, 0.75)',
                        borderColor: 'rgba(200, 200, 200, 0.75)',
                        HoverBackgroundColor: 'rgba(200, 200, 200, 1)',
                        HoverBorderColor: 'rgba(200, 200, 200, 1)',
                        data: available_quantity
                    }
                ]
            };

            var ctx = $("#mycanvas");

            var barGraph = new Chart(ctx, {
                type: 'horizontalBar',
                data: chartdata
            });
        }, 
        error: function(data) {
            console.log(data);
        }
    });
});
</script>

提前致谢

标签： phphtmlmysqlchartschart.js

解决方案

您似乎正在寻找join：

SELECT f.name, fd.available_quantity 
FROM food_details fd
INNER JOIN food f on f.id = fd.id
ORDER BY fd.id

此查询从表中检索name每个的，并将其放在第一列而不是. 行仍然是按顺序排序的-如果这是你想要的，你可以将其更改为。idfoodididname

推荐阅读