Highcharts + PHP + MySQL完全指南：从数据库读取到前端渲染，一文学会动态数据可视化

数据库中的数据

Highcharts 仅在客户端运行，并且完全不知道你的服务器是如何设置的。这意味着，如果你的服务器运行的是 PHP 和 MySQL，或者任何其他类型的服务器技术配合任何 SQL 引擎，你都可以动态生成 Highcharts 所需的 HTML 和 JavaScript。

有多种方法可以实现这一点。一种方法是创建一个只包含数据的特定PHP文件，然后用Ajax通过jQuery动态调用它，在生成图表之前将其添加到配置对象中。或者，你也可以用一个PHP文件返回整个图表的JavaScript设置。或者，最基本的方法是在你的父HTML页面中加入一些PHP代码，用来处理图表的数据。下面是一个基础的低级示例，演示如何从MySQL表中提取数据并将其添加到你的图表中。

具有规则间隔的简单数据

<?phpwhile($row=mysql_fetch_array($result)){$data[]=$row['value'];}?>varchart=newHighcharts.Chart({chart:{renderTo:'container'},series:[{data:[<?phpechojoin($data,',')?>],pointStart:0,pointInterval}]});

包含 x 值

假设你有一个日期时间的 X 轴，并且点之间的间隔不规则。这样你就不能像上面那样使用 pointInterval 方法，而需要为每个点获取对应的日期时间。你的代码现在可能会像这样：

<?phpwhile($row=mysql_fetch_array($result)){extract$row;$datetime*=1000;// convert from Unix timestamp to JavaScript time$data[]="[$datetime,$value]";}?>varchart=newHighcharts.Chart({chart:{renderTo:'container'},series:[{data:[<?phpechojoin($data,',')?>]}]});

作为这种低级方法的替代方案，还可以考虑使用 json_encode 来在 PHP 中编写整个选项结构。