【问题标题】:Highcharts chart won't loadHighcharts 图表无法加载
【发布时间】:2013-05-18 12:49:29
【问题描述】:

我正在尝试使用 SQLite3 数据库中的数据制作 Highcharts 折线图。不幸的是,图表不会加载。 tempdata.php 的输出是: [[1,12.8],[2,12.9],[3,12.8],[4,12.4]...等

如何让图表加载这些数据?

<!DOCTYPE HTML>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>Highcharts Example</title>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
        <script type="text/javascript">
    $(document).ready(function() {
        $.getJSON("tempdata.php", function(json) {

            chart = new Highcharts.Chart({
                chart: {
                    renderTo: 'container',
                    type: 'line',
                    marginRight: 130,
                    marginBottom: 25
                },
                title: {
                    text: 'Temperature',
                    x: -20 //center
                },
                subtitle: {
                    text: '',
                    x: -20
                },
                xAxis: {
                    title: {
                        text: 'Id'
                },
                yAxis: {
                    title: {
                        text: 'Temperature'
                    },
                    plotLines: [{
                        value: 0,
                        width: 1,
                        color: '#808080'
                    }]
                },
                tooltip: {
                    formatter: function() {
                            return '<b>'+ this.series.name +'</b><br/>'+
                            this.x +': '+ this.y;
                    }
                },
                legend: {
                    layout: 'vertical',
                    align: 'right',
                    verticalAlign: 'top',
                    x: -10,
                    y: 100,
                    borderWidth: 0
                },
                series: json
            });
        });

    });

});

        </script>
    </head>
    <body>
<script src="js/highcharts.js"></script>
<script src="js/modules/exporting.js"></script>

<div id="container" style="min-width: 400px; height: 400px; margin: 0 auto"></div>

    </body>
</html>

【问题讨论】:

    标签: highcharts getjson


    【解决方案1】:

    订单或操作错误,您正在加载应该在实际加载 highcharts.js 之前显示图表的脚本。

    要修复它,请在 jQuery 之后但在您实际使用它之前加载 highcharts.js。

    【讨论】:

      【解决方案2】:

      问题来了:

      series: json
      

      应该是:

      series: [{ 
          data: json
      }]
      

      【讨论】:

      • 我改变了这个,我也把 src=highcharts.js 放在了 js 代码的开头。还是行不通。我尝试在浏览器中加载 tempdata.php,但它给了我 404 错误。虽然使用 php5-cgi 运行它时运行良好。
      • 如果您使用的是 Chrome,请确保您的服务器正常工作,否则 Chrome 不允许在本地文件上使用 AJAX。
      猜你喜欢
      • 2013-01-23
      • 2016-10-28
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2021-03-26
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多