在ajax成功上重新绘制Jqplot

时间:2014-03-04 14:48:30

标签: javascript jquery ajax json jqplot

我正在使用此代码使用AJAX JSON Data Renderer创建Jqplot。一切正常。我在页面上有一个按钮,允许用户输入新值(通过ajax更新)。它存储在DB中(与json数据的来源相同)。

当按下按钮并且新值已添加到数据库时,我希望再次刷新jqplot(即检查ajax源)。

我尝试了一些方法,要么不更新图形,要么将图形叠加在一起。

$(document).ready(function(){
  // Our ajax data renderer which here retrieves a text file.
  // it could contact any source and pull data, however.
  // The options argument isn't used in this renderer.
  var ajaxDataRenderer = function(url, plot, options) {
    var ret = null;
    $.ajax({
      // have to use synchronous here, else the function 
      // will return before the data is fetched
      async: false,
      url: url,
      dataType:"json",
      success: function(data) {
        ret = data;
      }
    });
    return ret;
  };

  // The url for our json data
  var jsonurl = "./jsondata.txt";

  // passing in the url string as the jqPlot data argument is a handy
  // shortcut for our renderer.  You could also have used the
  // "dataRendererOptions" option to pass in the url.
  var plot2 = $.jqplot('chart2', jsonurl,{
    title: "AJAX JSON Data Renderer",
    dataRenderer: ajaxDataRenderer,
    dataRendererOptions: {
      unusedOptionalUrl: jsonurl
    }
  });
});

假设我需要将jqplot添加到一个函数中并销毁旧的情节,然后成功调用该函数? - 尽管如此,仍然可以使用该方法使事情正常工作。

任何帮助都会很棒。

由于

1 个答案:

答案 0 :(得分:0)

您是否尝试重新绘制图表?

var plot2 = $.jqplot('chart2', jsonurl,{
      title: "AJAX JSON Data Renderer",
      dataRenderer: ajaxDataRenderer,
      dataRendererOptions: {
      unusedOptionalUrl: jsonurl
    }
});

plot2.replot();

希望它有所帮助。

此致 阿尼什