使用C#字符串使用Chart.js创建图表会导致问题 - javascript

我正在尝试在asp.net应用程序中使用Chart Js 创建图表。我正在从代码数据库中获取数据并根据后端文档生成字符串。然后,我正在调用该Web方法来获取图表数据并将其呈现在页面上。

 function LoadVarianceChart() {
        var data;
        $.ajax({
            type: "POST",
            url: "Analysis.aspx/GetVarianceChart",
            data: "",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (r) {
                $("#dvVarianceChart").html("");
                var obj = r.d;
                console.log(obj);
                data = obj;

                var el = document.createElement('canvas');
                $("#dvVarianceChart")[0].appendChild(el);

                //Fix for IE 8
                if ($.browser.msie && $.browser.version == "8.0") {
                    G_vmlCanvasManager.initElement(el);
                }
                var ctx = el.getContext('2d');
                ctx.canvas.width = 300;
                ctx.canvas.height = 300;
                var userStrengthsChart;
                userStrengthsChart = new Chart(ctx).Bar(data);
            },
            failure: function (response) {
                alert('There was an error.');
            }
        });
    }

这是我的C#网络方法。

     [WebMethod]
    public static string GetVarianceChart()
    {
        DataSet ds = Utility.ExecuteDataTable("GetAdvarienceByBrandFamily", null);
        VarianceChartModel bar = new VarianceChartModel();

        bar.labels = ds.Tables[0].Rows[0][0].ToString().Split(',');
        bar.datasets = new List<datasets>();

        for (int i = 1; i < ds.Tables.Count; i++)
        {
            datasets dataset = new datasets();
            dataset.data = Array.ConvertAll(ds.Tables[i].Rows[0][0].ToString().Split(','), decimal.Parse);
            dataset.label = "new";
            dataset.fillColor = "rgba(220,220,220,0.5)";
            dataset.highlightFill = "rgba(220,220,220,0.75)";
            dataset.highlightStroke = "rgba(220,220,220,1)";
            dataset.strokeColor = "rgba(220,220,220,0.8)";
            bar.datasets.Add(dataset);
        }

        var serializer = new JsonSerializer();
        var stringWriter = new StringWriter();
        var writer = new JsonTextWriter(stringWriter);
        writer.QuoteName = false;
        serializer.Serialize(writer, bar);
        writer.Close();
        var json = stringWriter.ToString();
        return json.ToString();
    }
}

在这里,我的网络方法根据文档正确生成了字符串。如果我在图表js中静态使用生成的字符串,则图表将正确生成。但是,当我尝试通过调用后端方法提供相同的字符串时,它给了我Uncaught TypeError:无法读取未定义的属性“ length”

我不确定为什么相同的字符串会像这样。这与C#字符串和Java脚本字符串的兼容性有关吗?

参考方案

我发现了这个问题。这是使您可以通过使用asp.net从数据库中获取数据来创建图表的代码。

function LoadChart1() {
        var data;
        $.ajax({
            type: "POST",
            url: "Analysis.aspx/GetChart1",
            data: "{account: '" + $("[id*=ddlAccount]").val() + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (r) {
                $("#dvChart").html("");
                $("#dvLegend").html("");
                var obj = r.d;
                data = JSON.parse(obj);

                var el = document.createElement('canvas');
                $("#dvChart")[0].appendChild(el);

                //Fix for IE 8
                if ($.browser.msie && $.browser.version == "8.0") {
                    G_vmlCanvasManager.initElement(el);
                }
                var ctx = el.getContext('2d');
                ctx.canvas.width = 500;
                ctx.canvas.height = 500;
                var userStrengthsChart;
                userStrengthsChart = new Chart(ctx).Bar(data);
            },
            failure: function (response) {
                alert('There was an error.');
            }
        });
    }

这是将数据提供给图表的Web方法。

[WebMethod]
    public static string GetChart1(string account)
    {
        SqlParameter[] param = new SqlParameter[] { new SqlParameter("@account", account) };
        DataSet ds = Utility.ExecuteDataTable("GetChart1", param);
        if (ds.Tables[0].Rows.Count != 0)
        {
            VarianceChartModel bar = new VarianceChartModel();
            bar.labels = ds.Tables[0].Rows[0][0].ToString().Split(',');
            bar.datasets = new List<datasets>();

            for (int i = 1; i < ds.Tables.Count; i++)
            {
                string data = ds.Tables[i].Rows[0][0].ToString();
                if (!string.IsNullOrEmpty(data))
                {
                    datasets dataset = new datasets();
                    dataset.data = Array.ConvertAll(data.Split(','), decimal.Parse);
                    dataset.label = "new";
                    dataset.fillColor = "rgba(255, 102, 0,0.5)";
                    dataset.highlightFill = "rgba(255, 102, 0,0.75)";
                    dataset.highlightStroke = "rgba(255, 102, 0,0.50)";
                    dataset.strokeColor = "rgba(255, 102, 0,0.8)";
                    bar.datasets.Add(dataset);
                }
            }

            var serializer = new JsonSerializer();
            var stringWriter = new StringWriter();
            var writer = new JsonTextWriter(stringWriter);
            // writer.QuoteName = false;
            serializer.Serialize(writer, bar);
            writer.Close();
            var json = stringWriter.ToString();
            return json.ToString();
        }
        else
        {
            return null;
        }
    }

Javascript-Urls的奇怪字符串比较行为 - javascript

最近,在编写我无法理解的javascript时遇到了字符串比较的问题。我从完全相同的网址创建了两个字符串,当我比较它们时返回false,但是在重新分配相同的字符串后,比较返回true。这是我的示例:var str1 = "http://google.com/"; var str2 = "http://google.com‏/&#…

Javascript-从当前网址中删除查询字符串 - javascript

单击提交按钮后,我需要从网址中删除查询字符串值。我可以用jQuery做到这一点吗?当前网址:siteUrl/page.php?key=value 页面提交后:siteUrl/page.php 实际上,我已经从另一个带有查询字符串的页面着陆到当前页面。我需要在页面首次加载时查询字符串值以预填充一些详细信息。但是,一旦我提交了表格,我就需要删除查询字符串值。我已…

在JavaScript函数中转义引号 - javascript

我正在尝试将变量传递给javascript函数。根据用户的选择,它可以是文本或图像。这里已经讨论了类似的问题,但我无法解决。在php中,我这样编码:if ($choice == 1) { $img = '<img src = "../folder/'.$_SESSION["img"].'�…

如何调用超链接单击中包含单引号的消息的JavaScript警报? - javascript

我陷入了javascript问题。我正在使用C#编写可以调用javascript来显示警报消息的超链接。请参阅下面的代码以了解它是如何完成的:首先,这是C#从服务器端编写的代码://Server side code string myHyperlink = "<a href='#' onclick=\"alert…

如何在没有for循环的情况下在Javascript中使用Django模板标签 - javascript

我想在JavaScript中使用模板变量:我的问题是在javascript代码中使用for循环,for循环之间的所有事情都会重复..但我不想要....下面粘贴了我的代码..有人可以告诉我更好的方法吗这..因为这看起来很丑..这是我的代码: {% block extra_javascript %} <script src="/static/js…