gpt4 book ai didi

javascript - 从 MySQL 加载数据到 Highchart 并以适当的方式显示

转载 作者:行者123 更新时间:2023-11-30 22:18:33 25 4
gpt4 key购买 nike

我正面临 highchart 的问题。我一直在寻找解决方案 2 天,但没有结果。

live-data.php

<?php 
header("Content-type: text/json");
include("./dbSettings.php");
$result = $conn->query("SELECT current_ts, heartRate FROM data WHERE id='1234'");
if (!$result) {
die(mysqli_error($conn));
}
$ret = array();
while ($row = mysqli_fetch_array($result)){
$current_time = strtotime($row['current_ts'])*1000;
$heartRate = intval($row['heartRate']);
$y = rand(0, 100);
$ret[] = array($current_time, $heartRate);
}
echo json_encode($ret, JSON_NUMERIC_CHECK);
?>

来自 live-data.php 的输出

[[1463404815000,131],[1463404926000,108],[1463404927000,180],[1463404928000,160],[1463404967000,143],[1463404968000,105],[1463404969000,107],[1463404976000,100],[1463404977000,123],[1463867458000,108],[1463867459000,113],[1463867460000,108],[1463867494000,97],[1463867495000,158],[1463867496000,74]]

index.html(完全错了,不过我附上了)

<!DOCTYPE html>
<html>

<head>
<script data-require="jquery@*" data-semver="2.1.4" src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
<script data-require="highcharts@*" data-semver="4.0.1" src="//cdnjs.cloudflare.com/ajax/libs/highcharts/4.0.1/highcharts.js"></script>
<link rel="stylesheet" href="style.css" />
<script>

$(document).ready(function() {

var options = {
chart: {
renderTo: 'container',
type: 'spline'
},



series: [{}]
};

$.getJSON('live-data.php', function(data) {
options.series[0].data = data;
var chart = new Highcharts.Chart(options);
});

});

</script>

</head>

<body>
<div id="container"></div>
</body>

</html>

我想让我的图表看起来像下面这个,但要更详细一些。我会每分钟从我的数据库中检索数据。图表将在手动刷新后更新,但将来我会动态地(使用 ajax)进行更新。如果我能以适当的方式显示数据,那就太好了(即 2016 年 4 月 7 日,15:12:38)

http://jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/highcharts.com/tree/master/samples/stock/demo/basic-line/

我希望有人能在我的路上帮助我。

谢谢,保罗

最佳答案

我假设您在谈论工具提示日期,因为在 Axis 上您的标签会太长。

您需要使用 dateTimeLabelFormats。看我的例子:

http://jsfiddle.net/qq5rqazj/2/

关于javascript - 从 MySQL 加载数据到 Highchart 并以适当的方式显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37414792/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com