向下钻取动态值不起作用的图表。使用json我得到了所有动态值

时间:2018-09-18 10:02:26

标签: php jquery json

任何机构,请帮助我动态显示向下钻取图表。我正在尝试整合rgraph。但是使用静态值,一切正常。当我将其更改为动态问题时。第一次出现时间图表。点击该栏时显示为空。

我使用json编码将所有动态值存储在php数组中。以下是我使用json的jquery代码,我获得了所有值,但图表未显示。正在显示静态值图表

Data Json value=
{\"JFET\":\"2700,2325,2700,2700,7300,2700,2700,2700,2325,2700,2325,
 1204,2700,2100,2700,2700,2700,2700,800,2700,2200,2700,800,800,800,
 800,2325,2700,2325,2325,2700,0\"}
Lbel Json value=
{\"JFET\":\"'collegename1','collegename2','collegename3','collegename4'
 \"}etc

我同样得到了28种产品。 这些值在onclick函数上得到了

    <script>
   window.onload = function ()
   {
  //console.log(<?=$datadrill?>)
  var objarr = <?php echo json_encode($datajson); ?>;
  var myJSON = JSON.parse(objarr);
   var objarrlabel = <?php echo json_encode($labeljson); ?>;
   var myJSONlabel = JSON.parse(objarrlabel);
  // alert(myJSON.JFET);//alert(objarr) 
    var ca = document.getElementById("cvs");
    var data           = [<?=$label1?>]; //alert(data.length)
    var data_drilldown = [];
     var labels = [<?=$name2?>]
    // var d="$datadrill";
    /**
    * The drilldown data - the order corresponds to that of the labels
    */
     for(var k=0; k<data.length; ++k){ 
         var l=labels[k];
        //alert(myJSONlabel[l]);
        //var labeldril[k]=JSON.stringify(myJSONlabel[l]); 
       alert(labeldril[k])
         data_drilldown.push('['+myJSON[l]+']');
        }//alert(labeldril[0]);

   /* data_drilldown.push([2,3,1,2,3,1,3]);
   data_drilldown.push([2,2,2,1,2,2,3]);
    data_drilldown.push([1,1,1,2,3,2,2]);
    data_drilldown.push([3,3,3,2,3,3,1]);
    data_drilldown.push([4,3,1,1,3,2,2]);
    data_drilldown.push([3,2,2,2,3,1,0]);*/



    var bar = drawMainChart();

    /**
    * Draws the main chart
    */
    function drawMainChart ()
    {
        RGraph.reset(ca);

        var bar = new RGraph.Bar({
            id: 'cvs',
            data: data,
            options: {
                labels: labels,
                bevel: !RGraph.ISOLD,
                title: 'The whole teams statistics for sales of widgets',
                backgroundGridAutofitNumvlines: data.length,
                strokestyle:'rgba(0,0,0,0)',
                textAccessible: true,
                shadow: true
            }
        }).fadeIn();



        /**
        * When a bar is clicked show a more detailed breakdown
        */
        bar.onclick = function (e, shape)
        {
            var obj = e.target.__object__;
            var ca  = obj.canvas;
            var idx = shape.index;
         alert(data_drilldown[idx])
        //alert('['+myJSON[labels[idx]]+']')
        //alert('['+myJSONlabel[labels[idx]]+']')
            /**
            * Slide the old bar out
            */
            obj.fadeOut(null, function ()
            {
                RGraph.reset(ca);

                var bar = new RGraph.Bar({
                    id: 'cvs',
                    data: data_drilldown[idx],
                    //data:'['+myJSON[labels[idx]]+']',
                    options: {
               //labels: ['Monday','Tuesday','Wednesday','Thursday',
                         'Friday','Saturday','Sunday'],
                        labels: '['+myJSONlabel[labels[idx]]+']',
                        bevel: true,
                        strokestyle: 'rgba(0,0,0,0)',
                        title: 'Specific statistics for: ' + labels[idx],
                        backgroundGridAutofitNumvlines: 7,
                        textAccessible: true
                    }
                }).fadeIn();
            });
        }

        /**
        * The onmousemove event to change the cursor
        */
        bar.onmousemove = function (e, shape)
        {
            return true;
        }

        return bar;
    }

    document.getElementById("butBack").onclick = function (e)
    {
        var obj = ca.__object__;

        obj.fadeOut(null,function ()
        {
            var bar = drawMainChart();
        });
    }
};

有人请帮助我。

0 个答案:

没有答案