ASP.Net C#Google图表在运行时不显示

时间:2017-09-26 08:40:39

标签: c# asp.net google-visualization

我正在使用ASP.Net C#Google Charts内部报告网站,但我无法显示图表。代码似乎运行正常,并允许我在调试中运行。

我可以访问ASP页面,但没有图表。

编辑:最初的问题是错位的,我多么愚蠢!

我现在在浏览器控制台中遇到以下问题,可以提供任何帮助吗?

  

Parser-blocking,跨站点(即不同的eTLD + 1)脚本,   https://www.google.com/uds/?file=visualization&v=1&packages=corechart,   通过document.write调用。此脚本的网络请求可以   被浏览器阻止此页面或将来的页面加载由于不良   网络连接。如果在此页面加载中被阻止,它将是   在随后的控制台消息中确认。参见   https://www.chromestatus.com/feature/5718547946799104了解更多详情

以下代码;

ASP页面

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" 
AutoEventWireup="true" CodeBehind="ADMReports.aspx.cs" 
Inherits="ADMReports.ADMReports" %>
<%@ Register Assembly="ADMReports" Namespace="ADMReports" TagPrefix="asp" %>
<asp:Content ID="Content1" ContentPlaceHolderID="MainContent" runat="server">
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
        <script type="text/javascript" src="https://www.google.com/jsapi"></script>
    </head>
     <body>
        <div id="b_sale" style="width:500px; height:300px;">
            TEST
        </div>
    </body>
        <script>
            // VISUALIZATION API.
            google.load("visualization", "1", { packages: ["corechart"] });
            google.setOnLoadCallback(createPIE);

            function createPIE() {
                // SET CHART OPTIONS.
                var options = {
                    title: 'Total Invoices Per Month',
                    colors: ['#888', 'orange'],
                    is3D: true
                };

                $.ajax({
                    url: "ADMReports.aspx",
                    dataType: "json",
                    type: "POST",
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        var arrValues = [['Year', 'Month', 'OrdersProcessed']];        // DEFINE AN ARRAY.
                        var iCnt = 0;

                        $.each(data.d, function () {
                            // POPULATE ARRAY WITH THE EXTRACTED DATA.
                            arrValues.push([data.d[iCnt].Year, data.d[iCnt].Month], data.d[iCnt].OrdersProcessed]);
                            iCnt += 1;
                        });


                        var figures = google.visualization.arrayToDataTable(arrValues)


                        var chart = new google.visualization.PieChart(document.getElementById('b_sale'));

                        chart.draw(figures, options);      
                    },
                    error: function (XMLHttpRequest, textStatus, errorThrown) {
                        alert('Got an Error');
                    }
                });
            }
         </script>
</html>

asp页面背后的代码

我将修改SQL查询以从存储过程中提取,但是为了测试目的而保持简单。

public partial class ADMReports : System.Web.UI.Page
{
    private string Year;
    private string Month;
    private int OrdersProcessed;

    protected void Page_Load(object sender, EventArgs e)
    {

    }

    [WebMethod]
    public List<ADMReports> Total_Invoices()
    {
        List<ADMReports> Invoices = new List<ADMReports>();

        string sConnString = "Data Source=<servername>;Initial Catalog=<DB>;Integrated Security=True";

        SqlConnection myConn = new SqlConnection(sConnString);
        SqlCommand objComm = new SqlCommand("SELECT YEAR(DateTimeScanned) AS Year, MONTH(DateTimeScanned) AS Month, COUNT(OrderNumber) AS OrdersProcessed FROM tabTrace WHERE YEAR(DateTimeScanned) = YEAR(GETDATE()) GROUP BY MONTH(DateTimeScanned), YEAR(DateTimeScanned) ORDER BY MONTH ASC ", myConn);
        myConn.Open();

        SqlDataReader sdr = objComm.ExecuteReader();

        while (sdr.Read())
        {
            ADMReports objValues = new ADMReports();
            objValues.Year = sdr["Year"].ToString();
            objValues.Month = sdr["Month"].ToString();
            objValues.OrdersProcessed = (int)sdr["OrdersProcessed"];

            Invoices.Add(objValues);
        }

        myConn.Close();
        sdr.Close();
        return Invoices;
    }
}

1 个答案:

答案 0 :(得分:0)

我强烈建议在本地项目中添加所有相关脚本,并删除指向第三方参考的链接,例如。谷歌在这种情况下。这将有助于减少页面的加载时间,您也不会对托管在其他服务器上的此类脚本的随机更新感到惊讶。