Question

我正在尝试使用chart.js javascript库显示图形。我使用PHP代码从数据库中获取数据并将其发送到javascript，方法是使用json_encode()方法从PHP获取js var。数据实际上是表“湿度”和“温度”的两个字段。在js中接收到数据后，当我尝试从接收到的js对象中获取“湿度”和“温度”值时，我在第TypeError: jData is undefined行获得了hum = jData.humidity;，其中jData是js函数接收中的参数数据来自PHP中的脚本。

我尝试解析jData以便在获取值之前将其转换为js对象，但是随后在第SyntaxError: JSON.parse: unexpected character行收到了wData = JSON.parse(jData);。很少有SO出现相同错误的帖子告诉我，不应使用解析，因为jData已经处于js对象形式。

这是我的代码：

php代码：

 foreach($stmt->fetchAll() as $k=>$v) {       
      $WData[] = $v;
    }
    ?>

    <script>
      var WData = <?php echo json_encode($WData);?>;
      console.log(WData);
      dspChrt(WData);
    </script>

js代码：

function dspChrt(jData) { // to be called by loadChart() to render live chart

        //wData = JSON.parse(jData); 
        hum = jData.humidity;
        tem = jData.temperature;
        humArray.shift();
        humArray.push(hum);
        temArray.shift();
        temArray.push(tem);

        var ctx = document.getElementById('myChart').getContext('2d');
        var myChart = new Chart(ctx, {
        type: 'line',
        data: {
        labels: ['01:00', '02:00', '03:00', '04:00', '05:00', '06:00', '07:00', '08:00', '09:00', '10:00', '11:00', '12:00', '13:00', '14:00', '15:00', '16:00', '17:00', '18:00', '19:00', '20:00', '21:00', '22:00', '23:00', '00:00'],
        datasets: [{
        label: 'Humidity',
        data: humArray, // json value received used in method
        backgroundColor: "rgba(153,255,51,0.4)"
            }, {
        label: 'Temprature',
        data: temArray,
        backgroundColor: "rgba(255,153,0,0.4)"
        }]
        }
    }); 
    }

Answer 1

根据我以前在JS中呈现PHP json数据的经验，我可以通过将其呈现为字符串然后进行解析来获取它。像这样的东西。

var WData = "'"+<?php echo json_encode($WData);?>+"'";
 jData= JSON.parse(wData);

难以使用javascript中接收的php json_encode数据来使用chart.js库显示图形

1 个答案: