与IE8的Tomcat7和谷歌图表问题

时间:2013-10-16 13:56:57

标签: javascript tomcat internet-explorer-8 google-visualization

我做了一个使用谷歌图表(折线图)的应用程序。 如果我在我的本地Tomcat7实例上运行它,图表显示在IE8中,但在开发服务器中使用Tomcat7的实例它不能与Internet Explorer一起使用(没有错误但没有显示任何内容。使用Chrome而不是它正常工作)。

这里是在本地版本的浏览器中生成的源代码:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Phone Cost System</title>
        <link class="component" href="/phoneCostSystem/a4j/s/3_3_3.Finalorg/richfaces/renderkit/html/css/basic_classes.xcss/DATB/eAELXT5DOhSIAQ!sA18_.jsf" rel="stylesheet" type="text/css" /><link class="component" href="/phoneCostSystem/a4j/s/3_3_3.Finalorg/richfaces/renderkit/html/css/extended_classes.xcss/DATB/eAELXT5DOhSIAQ!sA18_.jsf" media="rich-extended-skinning" rel="stylesheet" type="text/css" /><link class="component" href="/phoneCostSystem/a4j/g/3_3_3.Finalorg/richfaces/renderkit/html/css/msg.css.jsf" rel="stylesheet" type="text/css" /><link class="component" href="/phoneCostSystem/a4j/g/3_3_3.Finalorg/richfaces/renderkit/html/css/msgs.css.jsf" rel="stylesheet" type="text/css" /><script src="/phoneCostSystem/a4j/g/3_3_3.Finalorg.ajax4jsf.javascript.AjaxScript.jsf" type="text/javascript"></script><script type="text/javascript">window.RICH_FACES_EXTENDED_SKINNING_ON=true;</script><script src="/phoneCostSystem/a4j/g/3_3_3.Finalorg/richfaces/renderkit/html/scripts/skinning.js.jsf" type="text/javascript"></script><link href="css/phoneCostSystem.css" rel="stylesheet" type="text/css" />
         <script type="text/javascript" src="https://www.google.com/jsapi"></script>

         <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});

      function drawChart(a) {

    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Year');
    data.addColumn('number', 'Sales');
    data.addColumn('number', 'Expenses');
    data.addColumn('number', 'Expenses2');

    data.addRows(JSON.parse(a.test));


    var options = {
        title: 'Company Performance',
        pointSize : 2,       
        interpolateNulls: true

    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);

      }
    </script>


    </head>

<body onload="submitApplication()">
    <div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;"></div>



            <div class="outer">
     <!-- START MAIN -->
                <div class="content">
                <div class="innercontent">
   <h4>My Expenses</h4>
    <dl id="myError" class="rich-messages errorMessage" style="display: none; "><dt></dt></dl>
<form id="form1" name="form1" method="post" action="/phoneCostSystem/charts.jsf" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="form1" value="form1" />


<div id="chart_div" style="width: 600px; height: 500px;"></div>
<script id="j_id_jsp_1252683611_4" type="text/javascript">//<![CDATA[
        submitApplication=function(){A4J.AJAX.Submit('form1',null,{'oncomplete':function(request,event,data){drawChart(data)},'similarityGroupingId':'j_id_jsp_1252683611_4','parameters':{'j_id_jsp_1252683611_4':'j_id_jsp_1252683611_4'} ,'containerId':'j_id_jsp_1252683611_0'} )};
        //]]></script>

    <script type="text/javascript">
        //example callback function
        function processData(data) {   
            console.log(data);
            var temp=JSON.stringify(data); 
            alert(temp);

        }

        //call the ajax method from javascript

    </script>

<input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="j_id2" />
</form>  



















        <br />
        <br />

        </div>
        </div>

        </div>

    </body>
</html>

这是我在开发服务器中运行应用程序时生成的代码:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title>Phone Cost System</title>
        <link class="component" href="/phoneCostSystem/a4j/s/3_3_3.Finalorg/richfaces/renderkit/html/css/basic_classes.xcss/DATB/eAELXT5DOhSIAQ!sA18_.jsf" rel="stylesheet" type="text/css" /><link class="component" href="/phoneCostSystem/a4j/s/3_3_3.Finalorg/richfaces/renderkit/html/css/extended_classes.xcss/DATB/eAELXT5DOhSIAQ!sA18_.jsf" media="rich-extended-skinning" rel="stylesheet" type="text/css" /><link class="component" href="/phoneCostSystem/a4j/g/3_3_3.Finalorg/richfaces/renderkit/html/css/msg.css.jsf" rel="stylesheet" type="text/css" /><link class="component" href="/phoneCostSystem/a4j/g/3_3_3.Finalorg/richfaces/renderkit/html/css/msgs.css.jsf" rel="stylesheet" type="text/css" /><script src="/phoneCostSystem/a4j/g/3_3_3.Finalorg.ajax4jsf.javascript.AjaxScript.jsf" type="text/javascript"></script><script type="text/javascript">window.RICH_FACES_EXTENDED_SKINNING_ON=true;</script><script src="/phoneCostSystem/a4j/g/3_3_3.Finalorg/richfaces/renderkit/html/scripts/skinning.js.jsf" type="text/javascript"></script><link href="css/phoneCostSystem.css" rel="stylesheet" type="text/css" />
         <script type="text/javascript" src="https://www.google.com/jsapi"></script>

         <script type="text/javascript">
      google.load("visualization", "1", {packages:["corechart"]});

      function drawChart(a) {

    var data = new google.visualization.DataTable();
    data.addColumn('string', 'Year');
    data.addColumn('number', 'Sales');
    data.addColumn('number', 'Expenses');
    data.addColumn('number', 'Expenses2');

    data.addRows(JSON.parse(a.test));


    var options = {
        title: 'Company Performance',
        pointSize : 2,       
        interpolateNulls: true

    };

    var chart = new google.visualization.LineChart(document.getElementById('chart_div'));
    chart.draw(data, options);

      }
    </script>


    </head>

<body onload="submitApplication()">
    <div id="overDiv" style="position:absolute; visibility:hidden; z-index:1000;"></div>



            <div class="outer">
     <!-- START MAIN -->
                <div class="content">
                <div class="innercontent">
   <h4>My Expenses</h4>
    <dl id="myError" class="rich-messages errorMessage" style="display: none; "><dt></dt></dl>
<form id="form1" name="form1" method="post" action="/phoneCostSystem/charts.jsf" enctype="application/x-www-form-urlencoded">
<input type="hidden" name="form1" value="form1" />


<div id="chart_div" style="width: 600px; height: 500px;"></div>
<script id="j_id_jsp_1829848551_4" type="text/javascript">//<![CDATA[
        submitApplication=function(){A4J.AJAX.Submit('form1',null,{'oncomplete':function(request,event,data){drawChart(data)},'similarityGroupingId':'j_id_jsp_1829848551_4','parameters':{'j_id_jsp_1829848551_4':'j_id_jsp_1829848551_4'} ,'containerId':'j_id_jsp_1829848551_0'} )};
        //]]></script>

    <script type="text/javascript">
        //example callback function
        function processData(data) {   
            console.log(data);
            var temp=JSON.stringify(data); 
            alert(temp);

        }

        //call the ajax method from javascript

    </script>

<input type="hidden" name="javax.faces.ViewState" id="javax.faces.ViewState" value="j_id2" />
</form>  



















        <br />
        <br />

        </div>
        </div>

        </div>

    </body>
</html>

关于可能的根本原因的任何想法?

提前致谢。

0 个答案:

没有答案