javascript - 绘制从 View PHP 发送到 Javascript 函数的数组-6ren

javascript - 绘制从 View PHP 发送到 Javascript 函数的数组

转载作者：行者123 更新时间：2023-12-03 10:16:25

25

4

您好，我有以下任务:

<小时/>

从数据库检索数据并保存到数组(CHECK)
将数组从 Controller 发送到 View (CHECK)
使用 json_encode (CHECK) 将该数组传递给 JavaScript 函数
使用 Bootstrap 图表绘制数组(问题!)

如果我使用 Bootstrap 图表(下面的 var d)附带的标准数组，它就可以工作。但是，当我尝试使用我的代码时，什么也没有发生。我哪里失败了？

var d = [[-373597200000, 315.71], [-370918800000, 317.45], [-368326800000, 317.50], [-363056400000, 315.86]]

我使用以下代码行:

var d =  JSON.parse( '<?php echo json_encode($my_values) ?>' );

这是我的数组的示例，如果我打印它以及中间的空图:http://postimg.org/image/3t3paj3vn/

这是我的完整代码:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>Flot Examples: Time Axes</title>
    <link href="../examples.css" rel="stylesheet" type="text/css">
    <!--[if lte IE 8]><script language="javascript" type="text/javascript" src="../../excanvas.min.js"></script><![endif]-->
    <script language="javascript" type="text/javascript" src="../../jquery.js"></script>
    <script language="javascript" type="text/javascript" src="../../jquery.flot.js"></script>
    <script language="javascript" type="text/javascript" src="../../jquery.flot.time.js"></script>

</head>
<body>
            <select id="chapter_select">
                 <option value="0"> Select Patient</option>
                 <?php foreach($patients as $patient):?>
                        <option value= <?php echo $patient->id?> > <?php echo $patient->name ?>                            </option>
                <?php endforeach?> 
            </select><br><br>
                <?php $i= 0;?>
                <?php foreach($datas as $row):?>
                    <?php  $my_values[$i] = (array($row['data'],$row['total']));?>
                    <?php $i = $i+1;?>
                <?php endforeach;?>

    <div id="content">

        <div class="demo-container">
            <div id="placeholder" class="demo-placeholder"></div>
        </div>

        <p>Monthly mean atmospheric CO<sub>2</sub> in PPM at Mauna Loa, Hawaii (source: <a href="http://www.esrl.noaa.gov/gmd/ccgg/trends/">NOAA/ESRL</a>).</p>

        <p>If you tell Flot that an axis represents time, the data will be interpreted as timestamps and the ticks adjusted and formatted accordingly.</p>

        <p>Zoom to: <button id="whole">Whole period</button>
        <button id="nineties">1990-2000</button>
        <button id="latenineties">1996-2000</button></p>

        <p>Zoom to: <button id="ninetyninequarters">1999 by quarter</button>
        <button id="ninetynine">1999 by month</button>
        <button id="lastweekninetynine">Last week of 1999</button>
        <button id="lastdayninetynine">Dec. 31, 1999</button></p>

        <p>The timestamps must be specified as Javascript timestamps, as milliseconds since January 1, 1970 00:00. This is like Unix timestamps, but in milliseconds instead of seconds (remember to multiply with 1000!).</p>

        <p>As an extra caveat, the timestamps are interpreted according to UTC and, by default, displayed as such. You can set the axis "timezone" option to "browser" to display the timestamps in the user's timezone, or, if you use timezoneJS, you can specify a time zone.</p>

    </div>

    <div id="footer">
        Copyright &copy; 2007 - 2014 IOLA and Ole Laursen
    </div>


    <script type="text/javascript">

    $(function() {

    var d =  JSON.parse( '<?php echo json_encode($my_values) ?>' );

        $("#latenineties").click(function () {
            $.plot("#placeholder", [d], {
                xaxis: {
                    mode: "time",
                    minTickSize: [1, "year"],
                    min: (new Date(1996, 0, 1)).getTime(),
                    max: (new Date(2000, 0, 1)).getTime()
                }
            });
        });

        $("#ninetyninequarters").click(function () {
            $.plot("#placeholder", [d], {
                xaxis: {
                    mode: "time",
                    minTickSize: [1, "quarter"],
                    min: (new Date(1999, 0, 1)).getTime(),
                    max: (new Date(2000, 0, 1)).getTime()
                }
            });
        });

        $("#ninetynine").click(function () {
            $.plot("#placeholder", [d], {
                xaxis: {
                    mode: "time",
                    minTickSize: [1, "month"],
                    min: (new Date(1999, 0, 1)).getTime(),
                    max: (new Date(2000, 0, 1)).getTime()
                }
            });
        });

        $("#lastweekninetynine").click(function () {
            $.plot("#placeholder", [d], {
                xaxis: {
                    mode: "time",
                    minTickSize: [1, "day"],
                    min: (new Date(1999, 11, 25)).getTime(),
                    max: (new Date(2000, 0, 1)).getTime(),
                    timeformat: "%a"
                }
            });
        });

        $("#lastdayninetynine").click(function () {
            $.plot("#placeholder", [d], {
                xaxis: {
                    mode: "time",
                    minTickSize: [1, "hour"],
                    min: (new Date(1999, 11, 31)).getTime(),
                    max: (new Date(2000, 0, 1)).getTime(),
                    twelveHourClock: true
                }
            });
        });

        // Add the Flot version string to the footer

        $("#footer").prepend("Flot " + $.plot.version + " &ndash; ");
    });

    </script>

</body>
</html>

最佳答案

问题是引导代码无法识别我的日期时间。因此，我将其转换为 UNIX 时间戳。这是我的查询

$query = $this->db->query("	SELECT exam.id AS exam, UNIX_TIMESTAMP(exam.date) AS data, SUM( choice.value ) AS total
									FROM exam INNER JOIN choice ON exam.id = choice.exam_id
									WHERE exam.patient_id =  $patient_id AND exam.id = choice.exam_id GROUP BY exam.date");
		$data = array();
		foreach ($query->result() as $row)
		{
			$data[] = array(
        'exam' => $row->exam,
		'data' => $row->data,
        'total'  => $row->total
		);
}
		return $data;

然后使用了 Faran Ali 的建议
var d =

	
var d = '<?php json_encode($my_values); ?>

关于javascript - 绘制从 View PHP 发送到 Javascript 函数的数组，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29850362/

25

4

0

文章推荐： javascript - Ext.form.Panel、Ext 5、对齐标签和字段

文章推荐： interface - 依赖注入(inject)和使用接口(interface)？

文章推荐： smtp - 如何正确设置 DNS SPF 记录？

文章推荐： javascript - 将 Django 条件从 javascript 传递回 django 的方法

详解C语言sscanf()函数、vsscanf()函数、vscanf()函数
C语言sscanf()函数：从字符串中读取指定格式的数据头文件： ?
php - 如何解释at()函数； substr()函数;伪代码中的exist()函数
最近，我有一个关于工作预评估的问题，即使查询了每个功能的工作原理，我也不知道如何解决。这是一个伪代码。下面是一个名为foo()的函数，该函数将被传递一个值并返回一个值。如果将以下值传递给foo函数，
VBS教程：函数-CStr 函数
CStr 函数返回表达式，该表达式已被转换为 String 子类型的 Variant。 CStr(expression) expression 参数是任意有效的表达式。说明通常，可以
VBS教程：函数-CSng 函数
CSng 函数返回表达式，该表达式已被转换为 Single 子类型的 Variant。 CSng(expression) expression 参数是任意有效的表达式。说明通常，可
VBS教程：函数-CreateObject 函数
CreateObject 函数创建并返回对 Automation 对象的引用。 CreateObject(servername.typename [, location]) 参数 serv
VBS教程：函数-Cos 函数
Cos 函数返回某个角的余弦值。 Cos(number) number 参数可以是任何将某个角表示为弧度的有效数值表达式。说明 Cos 函数取某个角并返回直角三角形两边的比值。此比值是
VBS教程：函数-CLng 函数
CLng 函数返回表达式，此表达式已被转换为 Long 子类型的 Variant。 CLng(expression) expression 参数是任意有效的表达式。说明通常，您可以使
VBS教程：函数-CInt 函数
CInt 函数返回表达式，此表达式已被转换为 Integer 子类型的 Variant。 CInt(expression) expression 参数是任意有效的表达式。说明通常，可
VBS教程：函数-Chr 函数
Chr 函数返回与指定的 ANSI 字符代码相对应的字符。 Chr(charcode) charcode 参数是可以标识字符的数字。说明从 0 到 31 的数字表示标准的不可打印的
VBS教程：函数-CDbl 函数
CDbl 函数返回表达式，此表达式已被转换为 Double 子类型的 Variant。 CDbl(expression) expression 参数是任意有效的表达式。说明通常，您可
VBS教程：函数-CDate 函数
CDate 函数返回表达式，此表达式已被转换为 Date 子类型的 Variant。 CDate(date) date 参数是任意有效的日期表达式。说明 IsDate 函数用于判断 d
VBS教程：函数-CCur 函数
CCur 函数返回表达式，此表达式已被转换为 Currency 子类型的 Variant。 CCur(expression) expression 参数是任意有效的表达式。说明通常，
VBS教程：函数-CByte 函数
CByte 函数返回表达式，此表达式已被转换为 Byte 子类型的 Variant。 CByte(expression) expression 参数是任意有效的表达式。说明通常，可以
VBS教程：函数-CBool 函数
CBool 函数返回表达式，此表达式已转换为 Boolean 子类型的 Variant。 CBool(expression) expression 是任意有效的表达式。说明如果 ex
VBS教程：函数-Atn 函数
Atn 函数返回数值的反正切值。 Atn(number) number 参数可以是任意有效的数值表达式。说明 Atn 函数计算直角三角形两个边的比值 (number) 并返回对应角的弧
VBS教程：函数-Asc 函数
Asc 函数返回与字符串的第一个字母对应的 ANSI 字符代码。 Asc(string) string 参数是任意有效的字符串表达式。如果 string 参数未包含字符，则将发生运行时错误。
VBS教程：函数-Array 函数
Array 函数返回包含数组的 Variant。 Array(arglist) arglist 参数是赋给包含在 Variant 中的数组元素的值的列表（用逗号分隔）。如果没有指定此参数，则
VBS教程：函数-Abs 函数
Abs 函数返回数字的绝对值。 Abs(number) number 参数可以是任意有效的数值表达式。如果 number 包含 Null，则返回 Null；如果是未初始化变量，则返回 0。
VBS教程：函数-FormatPercent 函数
FormatPercent 函数返回表达式，此表达式已被格式化为尾随有 % 符号的百分比（乘以 100 ）。 FormatPercent(expression[,NumDigitsAfterD
VBS教程：函数-FormatNumber 函数
FormatNumber 函数返回表达式，此表达式已被格式化为数值。 FormatNumber( expression [,NumDigitsAfterDecimal [,Inc

首页

博学

6Ren·AI

商城

javascript - 绘制从 View PHP 发送到 Javascript 函数的数组