0

我已经对我以前的脚本进行了更改，不确定是否可以在这里进行更改...无论如何我要做的是在单击相应的链接时，我想加载“highchart line graph”，所以用户不必离开这页纸。

我的main.php身体有

user2 -- <a href="#" onClick = "showgraph(2)"><img src="go.png"></a><BR>
user3 -- <a href="#" onClick = "showgraph(3)"><img src="go.png"></a>
<script src="js/highcharts.js"></script>
<div id="container"></div>

head 部分包含 [与上一个相比，我在我的 javascript 中进行了新的编辑]

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>
function showgraph(keyid,serid){
            $.ajax({
            type: "GET",
            url: "new_graph.php",
            data: "id="+keyid+"&serid="+serid,
            dataType: "json",
                success: function(data){
                drawgraph(data);
                }
            });
            return false;
        }


    function drawgraph(data){
            alert(data);
            var seriesData = [];
            var xCategories = [];
            var i, cat, series, namedata;
            for(i = 0; i < data.length; i++){
                cat = data[i].ddate;
                series = data[i].dvalue;
                namedata = data[i].dname;
                 //alert(cat);
                 if(xCategories.indexOf(cat) === -1){
                    xCategories[xCategories.length] = cat;
                    seriesData[seriesData.length] = series;
                 }
            }
            //alert(xCategories);
            alert(seriesData);
            //alert(namedata);
    $(function () {
         $('#container').highcharts({
            chart: {
                type: 'line',
                marginRight: 130,
                marginBottom: 25
            },
            title: {
                text: namedata,
                x: -20 //center
            },
            subtitle: {
                text: 'Source: Sitename.com',
                x: -20
            },
            xAxis: {
                categories: xCategories
            },
            yAxis: {
                title: {
                    text: 'Date'
                },
                plotLines: [{
                    value: 0,
                    width: 1,
                    color: '#808080'
                }]
            },
            tooltip: {
                valueSuffix: '°C'
            },
            legend: {
                layout: 'vertical',
                align: 'right',
                verticalAlign: 'top',
                x: -10,
                y: 100,
                borderWidth: 0
            },
            series: [{
                name: namedata,
                data: seriesData
            }]
        });
    });
    }
</script>

new_graph.php文件返回

我使用了 php json_encode($data) 函数。 

echo json_encode($return_arr);

返回

[{"dvalue":"25","ddate":"2013-07-25","dname":"samsung"},{"dvalue":"26","ddate":"2013-07-26","dname":"samsung"},{"dvalue":"25","ddate":"2013-07-27","dname":"samsung"},{"dvalue":"25","ddate":"2013-07-28","dname":"samsung"},{"dvalue":"24","ddate":"2013-07-29","dname":"samsung"},{"dvalue":"23","ddate":"2013-07-30","dname":"samsung"},{"dvalue":"21","ddate":"2013-07-31","dname":"samsung"},{"dvalue":"23","ddate":"2013-08-01","dname":"samsung"},{"dvalue":"30","ddate":"2013-08-02","dname":"samsung"},{"dvalue":"28","ddate":"2013-08-03","dname":"samsung"},{"dvalue":"25","ddate":"2013-08-04","dname":"samsung"},{"dvalue":"26","ddate":"2013-08-05","dname":"samsung"},{"dvalue":"30","ddate":"2013-08-06","dname":"samsung"},{"dvalue":"25","ddate":"2013-08-07","dname":"samsung"},{"dvalue":"30","ddate":"2013-08-08","dname":"samsung"}]

由于某种原因，图表没有与 seriesdata 一起显示，其余数据打印在图表上，例如类别和名称。

我关注了这个线程但没有运气 如何在 HighCharts 中为堆栈柱形图格式化我的 json 数据

老实说，我不擅长 jquery 和 highchart。如果有人在这里帮助我，我将不胜感激，在此先感谢您

4

1 回答 1

0

我在您的代码中看到了很多潜在的问题，如果不为您编码，我什至不知道从哪里开始。

这是一个希望有用的快速列表：

1.) 发布到 StackOverflow 时，请花时间正确格式化您的代码。如果您的真实代码是这样格式化的，请花时间适当地间隔并使其可读。

2.）这些天我永远不会XMLHttpRequest自己创建一个对象。JQuery 的 AJAX 功能将使您的生活变得如此轻松（它甚至可以在 IE 中工作）。我会从这里开始阅读。

3.)alert(val+date);应该做什么？这是两个数组，添加它们并发出警报可能不是您想要的。

4.) 这个：

for(i = 0; i < mySplitResult.length; i++) {
     var eachval=mySplitResult[i].split("|");
     val.push(eachval[0]);
     date.push(eachval[1]);
}
draw_graph(val,date);

是错的。Highcharts 需要数字来代表你的价值观（parseInt是你的朋友）。

您可能想要修复您的 PHP 以返回正确的 AJAX 而不是操作字符串。

5.) 最后检查categories: [date]and data: [val]（这些已经是数组，为什么要重新包装 in []）

于 2013-08-19T17:05:16.033 回答