javascript 使用DotNet HighCharts dll在后面的代码中制作图表

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/9225480/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 05:59:19  来源:igfitidea点击:

Use of DotNet HighCharts dll to make charts in code behind

c#javascript.nethighcharts

提问by James Gaunt

I just discovered the DotNetHighCharts dll to make charts: http://dotnethighcharts.codeplex.com/

我刚刚发现了 DotNetHighCharts dll 来制作图表:http://dotnethighcharts.codeplex.com/

I added the dll to my project and put a sample code to get a pie in my Page_Load event ( i'm not working with MVC right now, so i just took what was in the controller of the demo )

我将 dll 添加到我的项目中,并在我的 Page_Load 事件中放置了一个示例代码来获取一个馅饼(我现在没有使用 MVC,所以我只使用了演示控制器中的内容)

    protected void Page_Load(object sender, EventArgs e)
    {
        Highcharts chart = new Highcharts("chart")
        .InitChart(new Chart { PlotShadow = false })
        .SetTitle(new Title { Text = "Browser market shares at a specific website, 2010" })
        .SetTooltip(new Tooltip { Formatter = "function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; }" })
        .SetPlotOptions(new PlotOptions
        {
            Pie = new PlotOptionsPie
            {
                AllowPointSelect = true,
                Cursor = Cursors.Pointer,
                DataLabels = new PlotOptionsPieDataLabels
                {
                    Color = ColorTranslator.FromHtml("#000000"),
                    ConnectorColor = ColorTranslator.FromHtml("#000000"),
                    Formatter = "function() { return '<b>'+ this.point.name +'</b>: '+ this.percentage +' %'; }"
                }
            }
        })
        .SetSeries(new Series
        {
            Type = ChartTypes.Pie,
            Name = "Browser share",
            Data = new Data(new object[]
                                       {
                                           new object[] { "Firefox", 45.0 },
                                           new object[] { "IE", 26.8 },
                                           new DotNet.Highcharts.Options.Point
                                           {
                                               Name = "Chrome",
                                               Y = 12.8,
                                               Sliced = true,
                                               Selected = true
                                           },
                                           new object[] { "Safari", 8.5 },
                                           new object[] { "Opera", 6.2 },
                                           new object[] { "Others", 0.7 }
                                       })
        });

    }
}

}

}

the problem is that northing appears in my page with this Is there anything to add ? Thanks in advance

问题是北距出现在我的页面中 有什么要添加的吗?提前致谢

回答by James Gaunt

I'm not familiar with the library but all this code appears to be doing is creating an object in the code behind. You will need to do something to cause this to render in to the page.

我不熟悉这个库,但所有这些代码似乎都是在后面的代码中创建一个对象。您需要做一些事情才能使其呈现到页面中。

Looking at their example code behind code there is a line

查看代码后面的示例代码,有一行

ltrChart.Text = chart.ToHtmlString();

This is the bit you are missing. You need to call ToHtmlString() on your chart object and assign this string to a literal or placeholder in the page.

这是你缺少的一点。您需要在图表对象上调用 ToHtmlString() 并将此字符串分配给页面中的文字或占位符。

To create the literal just add this code somewhere on the page....

要创建文字,只需在页面上的某处添加此代码....

<asp:Literal ID="ltrChart" runat="server"></asp:Literal>

...and your chart should appear there.

...你的图表应该出现在那里。

回答by Gonzalo Reviriego

Based on their example you need to send the HTML to the client side with the line

根据他们的示例,您需要使用以下行将 HTML 发送到客户端

Response.Write(result);

It works to me, though it prints it at the top of the screen and I wish I could set the position for it.

它对我有用,虽然它打印在屏幕顶部,我希望我可以设置它的位置。