使用 PHP、MySQL 的 Chart.js 数据数组。如何从 JSON 数组定义数据源?

2023-12-25

这是我的第一个问题。对于任何错误,敬请谅解。

我正在尝试使用带有 PHP 和 MySQL 数据的 Chart.js 绘制图表。我打算绘制的图表是一个简单的垂直条形图,出生年与出生人数。当我显示数组 $BIRTH_YEAR 和 $COUNTS 时,我可以看到这些值。我直到 json_encode($data_array) 才明白这一点。当我尝试在 javascript 上使用这个编码数组时,我没有得到任何输出,一个空白页面!这是我的代码。

while ($row = mysql_fetch_array($result, MYSQL_ASSOC)) {
$data[] = array(
    $row['BIRTH_YEAR']=>$row['counts'],
);
$BIRTH_YEAR[]=$row['BIRTH_YEAR'];
$COUNTS[]=$row['counts'];
}

// JSON arrays for labels and counts
$js_labels = json_encode($BIRTH_YEAR,true);
$js_cols = json_encode($COUNTS,true);


var barChartData = {
        labels : '<?php echo $js_labels; ?>',
                    datasets : [
            {
                fillColor : "rgba(220,220,220,0.5)",
                strokeColor : "rgba(220,220,220,1)",
                data : '<?php echo $js_cols; ?>'
            }

        ]
                   }

var myLine = new Chart(document.getElementById("canvas").getContext("2d")).Bar(barChartData);

我已在页面中包含所有其他必需的 HTML 元素。当我使用 Chart.js 示例文件时,我能够看到图表。唯一的问题是我不确定如何在 javascript data: 部分中包含数组。提前致谢。


你可以使用$js_cols = json_encode($COUNTS,JSON_NUMERIC_CHECK);

进而

data : <?php echo print_r($js_cols,true); ?>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

使用 PHP、MySQL 的 Chart.js 数据数组。如何从 JSON 数组定义数据源? 的相关文章

  • 有没有办法在 TypeScript 2+ 中全局添加类型定义?

    我有一堆简单的 ts files 不是项目 即独立的 ts 脚本 他们使用一些 Node js 功能 TypeScript 和节点类型定义通过安装 npm install g typescript npm install g types n
  • 禁用任何类型的浏览器窗口滚动?

    有没有办法禁用滚动 不仅仅是滚动条 还有浏览器窗口的全部功能 根据您对 Keit 的回答 您不想在打开灯箱时滚动处于活动状态 如果是这种情况 您可以使用以下 css 在打开灯箱的同时向正文添加一个类 这个解决方案的好处是它保留了滚动 空间
  • Rails 4 - 带有 dependent-fields-rails 的条件 JS

    我正在尝试弄清楚如何在我的 Rails 4 应用程序中使用 dependent fields rails gem 我迷路了 我已将 underscore js 包含在我的供应商 javascripts 文件夹中 并更新了我的 applica
  • 如何使用 selenium 获取 javascript 结果?

    我有以下代码 from selenium import selenium selenium selenium localhost 4444 chrome http some site com selenium start sel selen
  • while 循环元素状态 cypress

    我有一个问题 我想单击一个按钮直到它消失 但次数可能会有所不同 所以我想检查可见性状态 当可见 true时单击按钮 当可见 false时结束测试 但问题是我不知道如何循环从获取元素到末尾的所有链 单击按钮一次 由于中断而停止 如果我删除中断
  • Javascript - 如何计算数字的平方?

    使用 JavaScript 函数 function squareIt number return number number 当给定数字 4294967296 时 函数返回 18446744073709552000 每个人都知道真正的答案是
  • php包含来自另一个目录的文件

    这是一个结构示例 main css style css include article1 php article2 php header php index php 在我的 header php 中 我有以下 css 代码 例如 在我的 i
  • 在mysql中搜索“SanF”时获取旧金山的记录

    当我搜索 SanF 时获得 San Francisco 记录 SELECT FROM table WHERE col LIKE san Works SELECT FROM table WHERE col LIKE san F Works S
  • Rspec 控制器测试,传递 JSON 参数

    我试图实现以下目标 在 RSpec 控制器测试中创建 POST json 请求 并向其传递参数 这是我的代码 it returns access token do post login email bla password bla1 for
  • 何时以及为何应使用 $_REQUEST 而不是 $_GET / $_POST / $_COOKIE?

    标题中的问题 当所有 3 个都发生时会发生什么 GET foo POST foo and COOKIE foo exist 其中哪一个被包含到 REQUEST 我想说永远不会 如果我想通过各种方法设置某些内容 我会为每个方法编写代码以提醒自
  • 盒式捆绑包与 MVC4 捆绑包

    我目前正在开发一个原型 ASP NET MVC 3 解决方案 该解决方案将用作多个项目重写的基础 来自 Web 表单 我的目标之一是跨应用程序实现一些脚本管理 而不是我们目前没有的目标 MVC 3有一个缺陷恕我直言 如果您需要在部分视图或模
  • Spark SQL/Hive 查询通过 Join 永远持续下去

    所以我正在做一些应该很简单的事情 但显然它不在 Spark SQL 中 如果我在 MySQL 中运行以下查询 查询将在不到一秒的时间内完成 SELECT ua address id FROM user u inner join user a
  • 如何在 ChartJS 中创建自定义图例

    我需要使用 ChartJS 库为我的圆环图创建自定义图例 我已经使用 ChartJS 提供的默认图例创建了甜甜圈 但我需要一些修改 我希望其价值高于汽车名称 另外 我不喜欢粘性图例 我想将其与甜甜圈分开 这样我就可以更改字体 框的样式 例如
  • 地址更改时如何停止 Angular 重新加载

    我正在使用 Angular 的scrollTo and anchorScroll像这样 app controller TestCtrl function scope location anchorScroll scope scrollTo
  • Chrome Prerender 功能每次都会被取消

    我正在尝试 Chrome 中的预渲染功能 但是当我检查网络时 我可以看到任何链接的请求都被取消 我使用以下语法 我尝试了现场演示http prerender test appspot com http prerender test apps
  • 如何仅在第一次访问时弹出模态窗口

    我有一个模式窗口 当您访问某个页面时会弹出 访客必须选择我同意或我不同意 我需要一个漂亮的小 jquery 脚本 它会记住谁之前访问过该页面并同意 这样他们每次访问该页面时就不会弹出模式 有人可以推荐一个好的脚本来使用吗 这是代码 div
  • 我可以防止将 Leaflet 地图平移到世界边缘之外吗?

    有没有办法限制平移到世界边缘之外 在这幅画中 棕色是世界 灰色是虚空 我想让它不可能像这样平移 Leaflet 允许您控制地图抵抗被拖出边界的程度maxBoundsViscosity选项 值 0 到 1 将其设置为最大值会完全禁用拖动出界
  • 学说“没有命名的协会”

    将我添加到无法找出其学说映射出了什么问题的人列表中 我正在模拟国际象棋Game与一对多Halfmoves 有任何想法吗 DDL create table game game id int primary key create table h
  • 更改Docker容器中的mysql密码

    我如何更改 docker 容器中的 root 密码 因为一旦我停止 mysql 服务 容器就会自动停止 我应该停止 mysql 容器并部署一个新容器吗 您可以使用正在运行的容器更改它docker exec session https doc
  • Angular 5 中 Observable.ForkJoin 的重复 Http 请求

    我有一个 Angular 5 应用程序 组件中包含以下代码 ngOnInit Observable forkJoin this highlightedInsight this insightService getHighlightedIns

随机推荐