2

我有一个呈现融合图表的 JSP。该图表使用 Spring 来获取它使用 MyBatis 作为 ORM 呈现的数据。当我点击呈现图表的超链接时,页面需要永远加载,因为获取的数据很大。我希望图表在查询运行时在图表中显示“加载数据”栏。JSP 的其他部分应该是可见的,并且图表在获取数据时应该显示“正在加载”。使用带有 XML 配置的 FUSION 闪存版本。提前致谢。

4

2 回答 2

1

看起来您的页面需要花费大量时间才能显示,因为要从 ORM 获取大量数据。当显示 JSP 页面以及 FusionCharts 正在渲染图表时,会显示“正在加载图表”消息。但是在您的情况下,根本不会呈现 JSP 页面。

作为解决此问题的方法,请尝试将两个进程分开,这样就有两个服务器端页面

  1. 当您单击超链接并显示 JSP 页面时,控制权交给谁
  2. 在加载 JSP 页面时,调用 AJAX 函数并将请求发送到另一个服务器端页面,该页面检索 FusionCharts 加载所需的数据。收到数据后,图表可以绘制数据。当图表绘制数据时,会显示“加载图表”消息。而且,在您收到数据之前,您可以在 div 中显示自定义消息。

由于 AJAX 会在它返回时通知您,因此您可以通过这样做来实现您想要的。

于 2013-08-12T10:28:31.853 回答
1

请参考下面的代码并确保您在数据提供者页面(Servlet)中使用“PrintWriter”对象将 XML/JSON 数据输出到页面的调用者(loadFusionCharts() 函数)

<script language='JavaScript'> //in the head section
/* create AJAX object */
function getXMLObject()
    {
        var xmlHttp = false;
        try {
            xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
        } catch (e) {
            try {
                xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
            } catch (e2) {
                xmlHttp = false;
            }
        }
        if (!xmlHttp && typeof XMLHttpRequest != 'undefined') {
            xmlHttp = new XMLHttpRequest();
        }
        return xmlHttp;
    }

var xmlhttp = new getXMLObject();

/*function to be called "onload" of body */
function loadFusionCharts()

{
  if (xmlhttp.readyState == 4 || xmlhttp.readyState == 0)
    {
    var url="someURL";  //URL of data provider page that gets data from database
    xmlhttp.open("POST", url, true);
    xmlhttp.onreadystatechange = handleServerResponse;
    xmlhttp.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
    xmlhttp.send(null);
    }
}
/* gets called when AJAX response comes back after executing the data provider page*/
function handleServerResponse()
    { 
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
        {
            var chartData = xmlhttp.responseText;
            if (chartData!="") 
            {
          var myChart = new FusionCharts( "./FusionCharts/ScrollCombi2D.swf","ChartId", "1040", "320", "0", "0");
          myChart.setXMLData(chartData);
          myChart.render("fcDiv");  
            }else{
                document.getElementById('fcDiv').innerHTML="Could not get data to render the chart";
            }
         }
    }

</script>
</head>
<body onload='loadFusionCharts()'>
于 2013-08-14T09:38:58.927 回答