0

Google チャート (折れ線グラフ) を使用するアプリケーションを作成しました。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>

考えられる根本原因に関する考えはありますか?

前もって感謝します。

4

0 に答える 0