MSSQL Server to PHP Array to JSON Encode to

Question

我有非常简单的数据，这些数据从我的MSSQL服务器到JSON_Encode。

这是我的PHP代码（位于myPHPFile.php）：

<?php

$serverName = "MyServer";

$connectionInfo = array( "Database"=>"MyDatabase", "UID"=>"MyUID", "PWD"=>"MyPWD");

$conn = sqlsrv_connect( $serverName, $connectionInfo);

$tsql = "SELECT * FROM [MyDatabase].[dbo].[MyView] ORDER BY Year";  

$stmt = sqlsrv_query( $conn, $tsql); 

$rows = array();

while($r = sqlsrv_fetch_array($stmt, SQLSRV_FETCH_ASSOC)) {

    $res[] = $r;

}

print json_encode($res, JSON_NUMERIC_CHECK);

sqlsrv_free_stmt( $stmt);  

sqlsrv_close( $conn);  

?> 

这给了我以下印刷品：

[{"Year":2016,"Number":41},{"Year":2017,"Number":512},{"Year":2018,"Number":1895},{"Year":2019,"Number":3132}] 

伟大。这是数据。

我已经尝试了每个教程，每个高图表论坛帖子和每个堆栈溢出问题，以从我的JSON格式的php文件中获取这些简单的数据，并将其转换为高图表。也许我错过了一些明显的东西。

让我们来看看我的HTML文件：

在头部：

<script src="https://code.highcharts.com/highcharts.js"></script>

<script src="https://code.highcharts.com/modules/exporting.js"></script>

<script type="text/javascript">

$(function () {

    var chart;

    $(document).ready(function() {

        $.getJSON("myPHPFile.php", function(json) {

            chart = new Highcharts.Chart({

                chart: {

                    renderTo: 'container',

                    type: 'line',

                },

                xAxis: {

                    title: { text: 'Year'}

                },

                yAxis: {

                    title: {

                        text: 'Number'

                    },

                    plotLines: [{

                        value: 0,

                        width: 1,

                        color: '#808080'

                    }]

                },

                series: json

            });

        });

    });

});

        </script>

然后显然是我的div

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

我错过了什么？HTML 窗口只是空白。不呈现图表。

Answer 1

高图表示例显示了设置图表的另一个示例。可以使用以下格式：$(document).ready(function() {&nbsp; $.getJSON("myPHPFile.php", function(json) {&nbsp; &nbsp; var series = json.map(function(record){&nbsp; &nbsp; &nbsp; &nbsp; return [record.Year, record.Number];&nbsp; &nbsp; })&nbsp; &nbsp; Highcharts.chart('container', {&nbsp; &nbsp; &nbsp; chart: {&nbsp; &nbsp; &nbsp; &nbsp; renderTo: 'container',&nbsp; &nbsp; &nbsp; &nbsp; type: 'line',&nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; xAxis: {&nbsp; &nbsp; &nbsp; &nbsp; title: {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text: 'Year'&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; yAxis: {&nbsp; &nbsp; &nbsp; &nbsp; title: {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; text: 'Number'&nbsp; &nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; },&nbsp; &nbsp; &nbsp; series: [{&nbsp; &nbsp; &nbsp; &nbsp; data: series&nbsp; &nbsp; &nbsp; }],&nbsp; &nbsp; });&nbsp; });});查看下面的实时演示：const data = [{&nbsp; "Year": 2016,&nbsp; "Number": 41}, {&nbsp; "Year": 2017,&nbsp; "Number": 512}, {&nbsp; "Year": 2018,&nbsp; "Number": 1895}, {&nbsp; "Year": 2019,&nbsp; "Number": 3132}];const series = data.map(record => [record.Year, record.Number])Highcharts.chart('container', {&nbsp; chart: {&nbsp; &nbsp; renderTo: 'container',&nbsp; &nbsp; type: 'line',&nbsp; },&nbsp; xAxis: {&nbsp; &nbsp; title: {&nbsp; &nbsp; &nbsp; text: 'Year'&nbsp; &nbsp; }&nbsp; },&nbsp; yAxis: {&nbsp; &nbsp; title: {&nbsp; &nbsp; &nbsp; text: 'Number'&nbsp; &nbsp; },&nbsp; },&nbsp; series: [{&nbsp; &nbsp; data: series&nbsp; }],});<script src="https://code.highcharts.com/highcharts.js"></script><script src="https://code.highcharts.com/modules/series-label.js"></script><script src="https://code.highcharts.com/modules/exporting.js"></script><div id="container"></div>