带有DateAxisRenderer和Ajax的jqPlot [英] jqPlot with DateAxisRenderer and ajax

查看:80
本文介绍了带有DateAxisRenderer和Ajax的jqPlot的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我在尝试在jqPlot图表上组合DateAxisRenderer和ajax时遇到了困难.下面的代码不会产生任何错误,但是会创建一个图表,该图表没有网格线,y轴上没有标签,也没有绘制数据点.仅有一个空白的白色图表背景,带有两个x轴标签,都说69年12月31日.

I'm running into difficulties trying to combine DateAxisRenderer and ajax on a jqPlot chart. The code below does not produce any errors but it creates a chart with no gridlines, no labels on the y axes, and no data points plotted. There is just a blank white chart background with two x axis labels both saying Dec 31, 69.

如果我换掉ajaxDataRenderer并使用数组中的数据,例如本例中所做的操作(

If I swap out the ajaxDataRenderer and use data from an array like what is done in this example (http://www.jqplot.com/tests/date-axes.php) everything renders correctly.

这是我的Javascript:

Here is my Javascript:

var ajaxDataRenderer = function(url, plot, options) {
   var ret = null;
   $.ajax({
        async: false,
        url: url,
        type: "GET",
        dataType:"json",
        success: function(data) {
            ret = data;
        },
        error:function (xhr, ajaxOptions, thrownError){
            alert(xhr.responseText);
        }
   });
   return ret;
};

var jsonurl = "http://localhost:8080/chartdata";
var plot2 = $.jqplot('chart2', jsonurl, {
    title:'Customized Date Axis',
    dataRenderer: ajaxDataRenderer,
    axes:{
        xaxis:{
           renderer:$.jqplot.DateAxisRenderer,
           tickOptions:{formatString:'%b %#d, %y'}
        }
    }
});

jsonurl返回的JSON如下:

The JSON being returned from jsonurl looks like:

[["2008-09-30 4:00PM",15],["2008-10-30 4:00PM",8],["2008-11-30 4:00PM",17],["2008-12-30 4:00PM",10]]

任何想法将不胜感激!

推荐答案

我发现了问题所在.从服务器返回的JSON需要包装在另一组方括号中.

I figured out the problem. The JSON returned from the server needs to be wrapped in another group of square brackets.

它应该像这样:

[[["2008-09-30 4:00PM",15],["2008-10-30 4:00PM",8],["2008-11-30 4:00PM",17],["2008-12-30 4:00PM",10]]]

这篇关于带有DateAxisRenderer和Ajax的jqPlot的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆