由网友(旧时光旧感情%)分享简介：我想创建一个简单的图表中的页面使用使用MySQL脚本获取MySQL数据I'm trying to create a simple chart in a page using mysql data retrieved using a mysql script我不明白如何将所需的图表的数据Ajax调用。我不;知道有足够...

我想创建一个简单的图表中的页面使用使用MySQL脚本获取MySQL数据

I'm trying to create a simple chart in a page using mysql data retrieved using a mysql script

我不明白如何将所需的图表的数据Ajax调用。我不;知道有足够的了解各种图表插件，使我的生活更轻松，我目前试用highchart

I don't understand how to integrate the ajax call with the data required for the chart. I don;t know enough about the various charting plugins to make my life easy and am currently trialing highchart.

我的PHP脚本返回以下JSON：

My php script returns the following json:

[{"name":"golfers"},{"data":[5.7879,6.6286,6.1724,5.3125,7.1481,6.1333,4.5769]}]

我的图表脚本是：

My chart script is:

$(function () {

visitorData(function(data) {
    console.info(data);
    $('#chart1').highcharts({
        chart: {
            type: 'column'
        },
        title: {
            text: 'Average Visitors'
        },
        xAxis: {
            categories: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']
        },
        yAxis: {
            title: {
                text: 'Number of visitors'
            }
        },
        series: data,
    });
});
});

我的功能，使Ajax调用：

my function to make the ajax call:

$.ajax({
        url: '/visitdata',
        type: 'GET',
        async: true,
        dataType: "json",
        success: function (data) {
            console.warn(data);
            return data;

        }
    });

但目前没有任何显示的。

But at the moment nothing is being displayed.

我不知道如何有效地进行Ajax调用，并将其纳入图表功能。我决定在回调的基础上较早尝试和职位，以确保数据在创建图表之前返回 - 这是位正确

I'm not sure how to effectively make the ajax call and integrate it into the chart function. I decided on a callback based on earlier attempts and posts to ensure data is returned before creating the chart - is this bit correct?

我不是100％肯定的JSON数据结构正确

I'm not 100% sure the json data is structured correctly

我不知道我，已经正确地应用数据变量​​的系列

I'm not sure i;ve applied the data variable to the series correctly

基本上 - 需要在本教程这样我就可以得到它的工作和实验

Basically - need a tutorial on this so I can get it working and experiment

pciated所有帮助AP $ P $

All help appreciated

感谢

推荐答案

我觉得不能从返回成功调用值而不是你需要调用一个函数。因此，设置你的函数，用于初始化您的图表，并在阿贾克斯成功调用的数据功能

I think you cannot return values from the success call instead you would need to call a function instead. So set up your function that initializes your chart, and in the ajax success call that function with the data

使用您的code例如

function visitorData (data) {
   $('#chart1').highcharts({
    chart: {
        type: 'column'
    },
    title: {
        text: 'Average Visitors'
    },
    xAxis: {
        categories: ['Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday', 'Sunday']
    },
    yAxis: {
        title: {
            text: 'Number of visitors'
        }
    },
    series: data,
  });
}
$(document).ready(function() {
 $.ajax({
    url: '/visitdata',
    type: 'GET',
    async: true,
    dataType: "json",
    success: function (data) {
        visitorData(data);
    }
  });
 });