如何正确地将JSON数组传递给JQPlot

时间:2015-07-25 08:29:48

标签: javascript jquery json jqplot

由于某些原因,我在JQPlot图表中正确处理JSON数组时遇到了一些问题。我怀疑数组被解释为单个值而不是一系列值。

我有一个函数可以对php脚本进行ajax调用。 php脚本计算图形数据并将其回送给用户,如下所示:

$retdata = array(); 
$retdata['date'] = array($ann_dates);
$retdata['close'] = array($closeperdiff);
$retdata['high'] = array($highperdiff);
$retdata['low'] = array($lowperdiff);
echo json_encode($retdata); 

这是客户端的ajax调用:

function getgraph(symbol)
{
  var datastring = "symbol=" + symbol;
      $.ajax({
            type: "POST",
            url: "quickview.php",
            data: datastring,
            dataType: "html",
            success: function( data ) {
                drawgraph(data);

            },
            error: function(){
                  alert('Error somewhere');
            }
        });
}

现在,最后调用我的JQPLot函数'drawgraph'并传递数据。我正在使用JSON.parse来分离数据,我无法正确地将其用于JQPlot。当我运行它时,它基本上只显示第一个条的第一个数字。我怀疑日期是一个长值的单个字符串。

我在jqplot函数中尝试过不同的“[]”变体,但无济于事。我有点难过!

function drawgraph(garray)
{
          var obj = JSON.parse(garray);

          //alert(obj["high"]) displays: 1,3,2,1,0,1
          //alert(obj["date"]) displays:  2015-05-29,2015-05-12,2015-04-30,2015-03-30,2015-02-27,2015-02-26 


          s1 = obj["high"];
          s2 = obj["low"];
          s3 = obj["close"];
          ticks = obj["date"];

          plot2 = $.jqplot('chart1', s1, s2, s3, {
                        title:'Bar Chart with Custom Colors',
                // Provide a custom seriesColors array to override the default colors.
                seriesColors:['#D1FFC2', '#ffCCCC', '#aeaeae'],
                renderer:$.jqplot.BarRenderer,
            seriesDefaults: {
                renderer:$.jqplot.BarRenderer,
                pointLabels: { show: true }
            },
            legend: {
        // This renderer is needed for advance legends.
        renderer: jQuery.jqplot.EnhancedLegendRenderer,
        show: true, 
        location: 's', 
        placement: 'outside',
        // Breaks the ledgend into horizontal.
        rendererOptions: {
          numberRows: '1',
          numberColumns: '3',
                barWidth: 25,
                barPadding:-10,
                barMargin: -10
        },
        seriesToggle: true
      },
            axes: {
                xaxis: {
                    renderer: $.jqplot.CategoryAxisRenderer,
                    ticks: [ticks]
                }
            }
        });

        $('#chart1').bind('jqplotDataHighlight', function (ev, seriesIndex, pointIndex, data) {
                $('#info2').html('series: '+seriesIndex+', point: '+pointIndex+', data: '+data);
            }
        );

        $('#chart1').bind('jqplotDataUnhighlight', 
            function (ev) {
                $('#info2').html('Nothing');
            }
        );

}

0 个答案:

没有答案