0

我正在尝试使用 json 数据在 jqplot 中绘制多条线我对 jqPlot 有疑问，我正在使用 json 数据在 jqPlot 中绘制图表。我有两组这样的 json 数据

var jsonData1 = {"PriceTicks": [{"Price":5.5,"TickDate":"Jan"}, 
                        {"Price":6.8,"TickDate":"Mar"},
                        {"Price":1.9,"TickDate":"June"},                            
                        {"Price":7.1,"TickDate":"Dec"}]};                               

      var jsonData2 = {"PriceTicks": [{"Price":1.5,"TickDate":"Jan"}, 
                        {"Price":2.8,"TickDate":"Feb"},
                        {"Price":3.9,"TickDate":"Apr"},                         
                        {"Price":9.1,"TickDate":"Dec"}]};

假设我有一个可以这样调用的 javascript 数组

$.jqplot('chartdiv', [cosPoints, sinPoints, powPoints1, powPoints2, powPoints3],
        {
          title:'Line Style Options',
          seriesDefaults: {
            showMarker:false,                           
        },  

        }
      );

其中cosPoints，sinePoints等是javascript数组，我必须以类似的方式调用json数据，我使用以下方式失败，请帮助我。

$.jqplot('jsonChartDiv', [jsonData1,jsonData2] {
          title:'Fruits',
          series:[{showMarker:false}],
          dataRenderer: $.jqplot.ciParser,            
          axes: {
              xaxis: {
                  renderer:$.jqplot.CategoryAxisRenderer,                     
              }
          },

        });
4

1 回答 1

0

我没有设法让 ciParser Renderer 插件与您的数据格式要求一起工作。

在下面的 jsFiddle 中，您会看到一个将 JSON 对象转换为显示折线图所需的数据结构的工作示例。

JSFiddle

// get array with both series
arSeries = [jsonData1, jsonData2];

// initalizat the output array for jqPlot
arJQ = [];

// for each Data Series 
for (var z = 0; z < arSeries.length; z++)
{
    // array for the prices
    jqPrices = [];
    var prices = arSeries[z].PriceTicks;
    for (var i = 0; i < prices.length; i++)
    {
        jqPrices.push([prices[i].TickDate.toString(), prices[i].Price]);
    }
    // Result [["Jan",1.5],["Feb",2.8],["Apr",3.9],["Dec",9.1]]
    // add to series array
    arJQ.push(jqPrices);
}

为防止该行倒退，您应该更详细地指定日期或在每个数据记录上使用相同的刻度。

于 2013-07-09T15:08:23.190 回答