Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/macos/10.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Highcharts呈现另一个图形';这也是数据_Javascript_Jquery_Html_Highcharts - Fatal编程技术网

Javascript Highcharts呈现另一个图形';这也是数据

Javascript Highcharts呈现另一个图形';这也是数据,javascript,jquery,html,highcharts,Javascript,Jquery,Html,Highcharts,我有一个html页面,其中有两个div。在每个div中,我加载不同的jsp文件(one.jsp和two.jsp) home.html: <script src="resources/js/jquery.js"></script> <script type="text/javascript" src="resources/js/highcharts.js"></script> <script type="text/javascrip

我有一个html页面,其中有两个div。在每个div中,我加载不同的jsp文件(one.jsp和two.jsp

home.html:

<script src="resources/js/jquery.js"></script>
  <script type="text/javascript" src="resources/js/highcharts.js"></script>
    <script type="text/javascript" src="resources/js/exporting.js"></script>
    <script type="text/javascript" src="resources/js/export-csv.js"></script> 
<script>
 function loadGraphs()
   {
    $('#plotContainer1').load('one.jsp');
    $('#plotContainer2').load('two.jsp');
   }
</script>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<div id="container1" style="min-width: 350px; height: 350px; margin: 0 auto"></div>
<script type="text/javascript">
var seriesArray;
var chart;
callAjax();
var graphTitle = "";
var chart;

function drawgraph1() {

    Highcharts.setOptions({
        colors: ['#54CBE5', '#57B442']
    });
    chart =  $('#container1').highcharts({
        chart: {
            zoomType: 'x'
        },
             title: {
                text: graphTitle
         },
         xAxis: {
            tickInterval: 30,
            type: 'datetime',

               categories: xAxisCategories 
        },
        yAxis: {
            min : 0,
            title: {
                text: ''
            },
        plotLines : [ {
            value : 0,
            width : 1,
            color : '#808080'
        } ]

       },

        plotOptions: {
            series: {
                marker: {
                    enabled: false
                }
            }
        }, 
            series : seriesArray
    });

};

function callAjax() {
    $("#container1").empty();

         seriesArray = [{
                name: 'line1',
                data: []
            }, {
                name: 'line2',
                data: []
            }];
    xAxisCategories = [];

    var params = {"param1" : value};        
    $.getJSON("graph1datafetcher",params, function(data) {

            $.each(data, function(key, val) {
                var xaxisPoints=data[key];
                xAxisCategories.push(Date.parse(key));
                for(var i in xaxisPoints) {
                    seriesArray[i].data.push(xaxisPoints[i]);  
                }
            });

            console.log(" JSON: " + JSON.stringify(data));

            drawgraph1();
        });
}

</script>

</body>
</html>

two.jsp几乎包含相同的代码。现在首先加载two.jsp,因为与one.jsp相比,它包含的数据更少。当one.jsp加载并显示在div中时,one.jsp图形显示two.jsp数据及其自身的数据。我正在控制台中记录数据,即将到来的数据很好。因此,问题在于海图中的某个地方保留了第一个数据。在过去的7个小时里,我一直在努力解决这个问题。有人能回答如何解决这个问题吗

我很确定问题在于你使用的变量名称完全相同,都是全局变量。所以一个变量覆盖了第二个变量。使变量成为局部变量(通过将参数传递给函数),或更改名称。XaxiCategories是全局变量。使用顶部的var声明它。