查询结果重叠

Question

我试图显示3个具有不同数据的图表，但是如果我逐个运行这些图表，则最后一个图表中的数据将显示在第一个图表中。它可以正常工作，但同时执行所有3个图表时，都会发生错误。 >

包括索引页和图表页的代码如果有人可以帮助您，请先谢谢。

索引页： 文件包含在这里。

     <?php
   if(file_exists(__DIR__.'/'.MODULES_DIR.'/widgets/garments-production- 
  summary-chart.php')){
  include_once __DIR__.'/'.MODULES_DIR.'/widgets/garments-production- 
  summary-chart.php';
    }
   ?>
            </div>
           <div class="col-md-12">
            <div class="row">
            <?php

              if(file_exists(__DIR__.'/'.MODULES_DIR.'/widgets/spining- 
              production-summary-chart.php') && $_SESSION['USER_ID']==1)
                       {
                  include_once __DIR__.'/'.MODULES_DIR.'/widgets/spining- 
                     production-summary-chart.php';
                    }
               ?>
             <?php
                   if(file_exists(__DIR__.'/'.MODULES_DIR.'/widgets/denim- 
                   production-summary-chart.php') && 
                   $_SESSION['USER_ID']==1){
                  include_once __DIR__.'/'.MODULES_DIR.'/widgets/denim- 
                   production-summary-chart.php';
                        ?>







                                     <div class="col-md-6">

                    <div class="panel panel-grape">
                        <div class="panel-body">
                            <div class="row">
                                <div class="col-md-12 clearfix">
                                    <h4 class="pull-left" style="margin: 0 0 
        20px;">Denim Production Activity <small>(Daily)</small></h4>


                                    <div class="btn-group pull-right">
                                        <a href="<?php echo APP_SERVER 
                              .'menu/148/production-report.php?t=5';?>" 
                   class="btn btn-default btn-sm active">Full Details</a>
                                    </div>
                                    <div id="graph_legend" class="pull- 
                     right" style="margin-right: 10px;">

                                    </div>
                                </div>
                                <div class="col-md-12">
                                    <div id="budget-variance" 
    style="height:250px;"></div>
                                </div>
                            </div>
                        </div>
                    </div>

                </div>

             <script type="text/javascript">
             $(document).ready(function() {        
           <?php 

$conn2 =  new DB(D_DB_HOST, D_DB_USER, D_DB_PASSWORD, D_DB_TYPE);

    $fDate   =    date('d-M-Y',  strtotime('-5 days'));
    $tDate   =    date("d-M-Y");

$s = "SELECT * FROM V_INSP_PROD WHERE PROD_DATE BETWEEN : FDATE AND : TDATE";

$prams = array('TDATE'=>$tDate,'FDATE'=>$fDate );
$record = $conn2->Select($s,$prams);
//print_r($record);
if(isset($record)) { ?>
var d1 = [
 <?php 
                            $i=0;
                            $values = array_column($record, 'I_TOTAL_PRODUCTION');
                            foreach($values as $value) { 
                            echo '['.$i++.', \''.$value.'\'],';
                             } 
            ?>
    ];
    var d2 = [
                        <?php 
                            $i=0;
                            $values = array_column($record, 'TOTAL_PRODUCTION');
                            foreach($values as $value) { 
                            echo '['.$i++.', \''.$value.'\'],';
                             } ?>
    ];

    for (var i = 1; i < 3; i++) {
        d1.push([i, parseInt(Math.random() * 1)]);
        d2.push([i, parseInt(Math.random() * 1)]);

    }

    var ds = new Array();

  ds.push({
    data:d1,
    label: "In House",
    bars: {
        show: true,
        barWidth: 0.1,
        order: 1
    }
    });
    ds.push({
        data:d2,
        label: "Out Source",
        bars: {
            show: true,
            barWidth: 0.1,
            order: 5,
        }
    })

    var variance = $.plot($("#budget-variance"), ds, {
        series: {
            bars: {
                show: true,
                fill: 0.75,
                lineWidth: 0,
                align: "center", 
                barWidth: 0.7
            }
        },
        grid: {
            labelMargin: 0,
            hoverable: true,
            clickable: true,
            tickColor: "#e6e7e8",
            borderWidth: 0
        },
        colors: ["#EDC240", "#556b8d", "#9440ED" , "#AFD8F8", "#4DA74D"],
        xaxis: {
                        ticks: [
                            <?php 
                            $i=0;
                            $theDates = array_column($record, 'PROD_DATE');
                            foreach($theDates as $theDate) { 
                            echo '['.$i++.', \''.$theDate.'\'],';
                             } ?>
                        ], 
            tickColor: "transparent",
            autoscaleMargin: 0, 
            tickDecimals: 0,
            labelWidth: 25,
            /*
            ,

           ,

            font: {
                color: '#8c8c8c',
                size: 10
            }
            ,
            */
           rotateTicks: 30 
        },
        yaxis: {
       max: 100000, 
       min: 0
        },
        legend : {
            labelBoxBorderColor: 'transparent',
            container:$("#graph_legend")
        }
    });

        var previousPointBar = null;
        $("#budget-variance").bind("plothover", function (event, pos, item) {
        $("#x").text(pos.x.toFixed(2));
        $("#y").text(pos.y.toFixed(2));
        if (item) {
            if (previousPointBar != item.dataIndex) {
                previousPointBar = item.dataIndex;

                $("#tooltip").remove();
                var x = item.datapoint[0].toFixed(2),
                    y = item.datapoint[1].toFixed(2);

                showTooltip(item.pageX+20, item.pageY, item.series.label + ": " + Math.round(y));

            }
        } else {
            $("#tooltip").remove();
            previousPointBar = null;
        }
    });

    function showTooltip(x, y, contents) {
        $('<div id="tooltip" class="tooltip top in"><div class="tooltip-inner">' + contents + '<\/div><\/div>').css({
            display: 'none',
            top: y - 40,
            left: x - 55,
        }).appendTo("body").fadeIn(200);
            }
          $(".flot-x-axis.flot-x1-axis.xAxis.x1Axis").find($(".flot-tick- 
       label.tickLabel")).hide()
     <?php } ?>

    });
</script>