上传到服务器时,Google图表启用页面未加载

时间:2013-08-07 12:28:30

标签: javascript jquery html

我为子域名上传了以下index.html文件但未正确加载。它只显示标题标签。

我希望在去xxx.myapp.com时加载它。在godaddy上设置正常,因为我看到了标题,但页面的其余部分没有呈现。另外我看到服务器上的网络请求没有任何意义......

有什么想法吗?

<!DOCTYPE html>
<html>
<head>
    <title>MI Testing title</title>

    <!--Load the AJAX API-->
    <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    <script type="text/javascript" src="http://www.myapp.com/JS/HelperFunctions.js"></script>
    <script type="text/javascript" src="http://www.myapp.com/JS/Settings.js"></script>

    <!-- zurb foundation-->
    <link type="text/css" rel="stylesheet" href="http://www.myapp.com/foundation-4.3.1/CSS/foundation.css" />
    <link type="text/css" rel="stylesheet" href="http://www.myapp.com/foundation-4.3.1/CSS/foundation.min.css" />
    <link type="text/css" rel="stylesheet" href="http://www.myapp.com/foundation-4.3.1/CSS/normalize.css" />

    <!--Local css -->
    <link type="text/css" rel="stylesheet" href="http://www.myapp.com/CSS/AnalyticsIndex.css"/>

    <script src="http://code.jquery.com/jquery-latest.min.js"></script>
    <script type="text/javascript">


        // Load the Visualization API and the piechart package.
        google.load('visualization', '1.0', {'packages':['corechart']});

        // Set a callback to run when the Google Visualization API is loaded.
        google.setOnLoadCallback(drawCharts);

        /*
        Called when library loaded
         */
        function drawCharts(){
            drawDailyAverageSessionLength();
            drawUsersGender();
        }

        /*
        Draws the chart for average session length by day
         */
        function drawDailyAverageSessionLength() {

            //Apit to get the data from
            var api = GET_AVG_SESSIONS_URL+"2013/0/0";

            //Request data (using jquery/ajax)
            $.getJSON(api,function(data){

                //Start a days and seconds array
                var days = [];
                var seconds = [];

                //Init google data array
                var googData = new google.visualization.DataTable();

                //Add X Y columns
                googData.addColumn('string', 'days');
                googData.addColumn('number', 'seconds');

                //Init sort array
                var sorted =[];

                //Parse the results to get the dates
                for (var key in data){
                    var date = new Date(key);
                    sorted.push(date);
                }

                //Sort the array
                sorted.sort(sortDateArrayDescending);

                //Split results
                for (i=0;i<sorted.length;i++){

                    //Get the date object
                    var day = sorted[i];

                    //Add 1 to month
                    var month = day.getMonth()+1;

                    //Parse to string
                    var newKey = day.getFullYear()+'-'+month+'-'+day.getDate();

                    var short = month+'/'+day.getDate();

                   //Add date to days array
                    days.push(short);

                    //Add to integer array
                    seconds.push(parseInt(data[newKey]));
                 }

                //Parse to google data
                for (i=0; i<days.length;i++){
                    googData.addRow([days[i], seconds[i]]);
                }

                // Set chart options
                var options = {'title':'Average session length (NOT ACCURATE since end of sessions aren\'t being tracked)',
                    'width':1200,
                    'height':400};

                // Instantiate and draw our chart, passing in some options.
                var chart = new google.visualization.LineChart(document.getElementById('averageSessionLengthChart'));
                chart.draw(googData, options);
            });
        }

        /*
         Draws the chart for average session length by day
         */
        function drawUsersGender() {

            //Apit to get the data from
            var api = GET_USERS_SEX;

            //Request data (using jquery/ajax)
            $.getJSON(api,function(data){

                //Start a days and seconds array
                var result = [['gender', 'number']];

                //Iterate over the genders
                for (var gender in data){

                    //Get the value pair and push
                    var entry = [gender, parseInt(data[gender])];
                    result.push(entry);
                }

                //Parse to google data
                var data = google.visualization.arrayToDataTable(result);

                //Display options
                var options = {
                    title:'Gender for registered users',
                    'width':600,
                    'height':400
                };

                //Draw the chart
                var chart = new google.visualization.PieChart(document.getElementById('genderChart'));
                chart.draw(data, options);
            });
        }

    </script>

</head>
<body>

    <div class="row">

        <div id = "averageSessionLengthChart" class="large-12 small-12 columns">
        </div>
     </div>

    <div class="row">

        <div id = "genderChart" class="large-12 small-12 columns">
        </div>
    </div>

</body>
</html>

1 个答案:

答案 0 :(得分:1)

从网络外的PC尝试使用开发人员控制台查看发送的请求(在Chrome上按'F12'或在Firefox上安装firebug扩展)。 应该有一个“网络”选项卡,显示从页面发出的请求。 也许它会帮助你理解正在发生的事情。