jqPlot：从json定义图表参数

我试图弄清楚是否可以从json文件中配置图表，以及如何配置图表

让我们用另一种方式来写这句话：我可以使用json文件将要绘图的数据和图表参数传递给jqPlot吗

到目前为止，我只是使用json文件来存储数据

有什么建议吗

提前感谢,，

---

Evan

您可以，下面是一个使用AJAX调用的示例：

$.ajax({
  url: 'input.json',
  dataType: 'json',
  success: function(options) 
    {                                   
        var data = [
        [3, 7, 9, 1, 4, 6, 8, 2, 5],
        [4, 8, 10, 2, 5, 7, 9, 3, 6],
        [5, 9, 11, 3, 6, 8, 10, 4, 7],
        [6, 10, 12, 4, 7, 9, 11, 5, 8],
        [7, 11, 13, 5, 8, 10, 12, 6, 9]];

        var plot = $.jqplot('chart', data, options);                
    },
  error: function(jqXHR, textStatus, errorThrown)
  {
    alert(textStatus)
  }
});

这里的图表选项是从（本例中）本地JSON文件中检索的，如下所示：

{
"legend": {        
    "show": true,
    "placement": "outsideGrid",
    "location": "s",
    "rendererOptions": {
        "numberRows": 1
    }
},
"seriesDefaults": {
    "showMarker": false,
    "fill": false
}}

---

然后像往常一样生成绘图。一个限制（我相信）：如果您想使用自定义呈现程序（如$.jqplot.DateAxisRenderer），则不能通过JSON指定

我不知道你们其他人的情况，但我不喜欢这里的反应，我决心让这一切顺利进行。我终于成功了，它可以毫无问题地使用“$.jqplot.DateAxisRenderer”之类的东西

在我的例子中，我实际上是从CherryPy应用程序传递东西，我需要能够将选项作为JSON与图表的数据一起传递。最后，我将整个选项集作为字符串传递，然后使用EVAL将其更改回javascript代码。一旦我弄明白了语法，它实际上工作得非常完美。这是使它工作的最好方法

1） 在不使用任何JSON的情况下找出所有选项，以确保绘图实际正常工作。
2） 逐字复制jqPlot的options参数。
3） 确保在选项周围添加括号，以便EVAL正确计算，否则将出现语法错误。
4） 将整个内容封装到服务器端的字符串类型对象中。
5） 这将通过JSON.dumps进行处理，因为它与您的其余数据一起返回到客户端。
6） 在客户端javascript上，只需对返回的对象进行求值，并将结果设置为您的选项参数。

下面是一个例子：
正如您在这里看到的，我还在选项中调用数据渲染器。只要在客户机上的适当上下文中调用这些选项，它就会对所有变量进行评估，等等。这一切都很好，工作也很完美。这是在jQuery1.11.0和jqPlot 1.0.8r1250中实现的

服务器对象：

options = """({
        dataRenderer: ajaxDataRenderer,
        dataRendererOptions: {
            name: name
        },
        axes:{
            xaxis:{
                label:xLabel,
                renderer:$.jqplot.DateAxisRenderer,
                tickOptions:{formatString:'%R'}
            },
            yaxis:{
                tickOptions:{
                    formatString:'%.0f'
                }
            }
        },
        legend: {
            show: true,
            placement: 'outsideGrid',
            labels: seriesLabels,
            location: 'ne',
            rowSpacing: '0px'
        },
        highlighter: {
            show: true,
            sizeAdjust: 7.5
        },
        cursor: {
            show: true,
            zoom:true
        }
    })"""

返回客户：

output = json.dumps({
                     'name': name,
                     'xLabel': header[0],
                     'seriesLabels': header[1:],
                     'parms': parms,
                     'options': options,
                     'parmData': parmData,
                     'successful': True
                     })

Javascript:

var options = eval(incomingData.options);
var plot = $.jqplot('chart_'+name, "/getChartData", options);

---

谢谢Kryptic，但有一点仍然不清楚：input.json是否包含选项？在这种情况下，我应该写：var plot=$.jqplot（'chart'，data，url）？我在哪里传递json图表选项？@EBAH yes，input.json包含这些选项。这些选项是从ajax请求返回的数据（success函数中的变量“options”），这就是传递给jqplot的内容。